Skip to content

Split existing CSS styles into multiple scss partials #3920

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.

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 4 commits into from
Nov 23, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
2 changes: 1 addition & 1 deletion lib/resources/docs.dart.js.map

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion lib/resources/styles.css

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion web/sig.txt
Original file line number Diff line number Diff line change
@@ -1 +1 @@
22A0DF76266C40F6C6821F473937789F
E8ACF6F50B82736C814C1F0BDE7849EE
40 changes: 40 additions & 0 deletions web/styles/_base.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,40 @@
// Copyright (c) 2024, the Dart project authors. Please see the AUTHORS file
// for details. All rights reserved. Use of this source code is governed by a
// BSD-style license that can be found in the LICENSE file.

html,
body {
margin: 0;
padding: 0;
height: 100%;
width: 100%;
overflow: hidden;
box-sizing: border-box;
}

*, *:before, *:after {
box-sizing: inherit;
}

body {
display: flex;
flex-direction: column;
-webkit-overflow-scrolling: touch;
}

body {
-webkit-text-size-adjust: 100%;
overflow-x: hidden;
font-family: Roboto, sans-serif;
font-size: 16px;
line-height: 1.42857143;
color: var(--main-text-color);
background-color: var(--main-bg-color);
}

main {
flex: 1;
display: flex;
flex-direction: row;
min-height: 0;
}
69 changes: 69 additions & 0 deletions web/styles/_breadcrumbs.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,69 @@
// Copyright (c) 2024, the Dart project authors. Please see the AUTHORS file
// for details. All rights reserved. Use of this source code is governed by a
// BSD-style license that can be found in the LICENSE file.

.gt-separated {
list-style: none;
padding: 0;
margin: 0;
}

.gt-separated li {
display: inline-block;
}

.gt-separated li:before {
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'><path fill='%23DDDDDD' d='M6.7,4L5.7,4.9L8.8,8l-3.1,3.1L6.7,12l4-4L6.7,4z'/></svg>");
background-position: center;
content: "\00a0";
margin: 0 6px 0 4px;
padding: 0 3px 0 0;
}

.gt-separated.dark li:before {
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'><path fill='%23727272' d='M6.7,4L5.7,4.9L8.8,8l-3.1,3.1L6.7,12l4-4L6.7,4z'/></svg>");
}

.gt-separated li:first-child:before {
background-image: none;
content: "";
margin: 0;
padding: 0;
}

.breadcrumbs {
padding: 0;
margin: 8px 0 8px 0;
white-space: nowrap;
line-height: 1;
}

@media screen and (min-width: 840px) {
nav ol.breadcrumbs {
float: left;
}
}

@media screen and (max-width: 840px) {
.breadcrumbs {
margin: 0 0 24px 0;
overflow-x: hidden;
}
}

.breadcrumbs .gt-separated .dark .hidden-xs li + li:before {
color: var(--main-h-text);
}

ol.breadcrumbs li a {
color: var(--main-hyperlinks-color);
}

.self-crumb {
color: var(--main-h-text);
}

.self-name {
color: #555;
display: none;
}
66 changes: 66 additions & 0 deletions web/styles/_code.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,66 @@
// Copyright (c) 2024, the Dart project authors. Please see the AUTHORS file
// for details. All rights reserved. Use of this source code is governed by a
// BSD-style license that can be found in the LICENSE file.

pre code {
white-space: pre;
word-wrap: initial;
font-size: 100%
}

pre {
border: 1px solid #ddd;
background-color: #eee;
font-size: 14px;

@media(max-width: 840px) {
margin: 16px 0;
}
}

code {
font-family: 'Roboto Mono', Menlo, monospace;
color: inherit;
padding: 0.2em 0.4em;
font-size: 85%;
background-color: rgba(27, 31, 35, 0.05);
border-radius: 3px;
}

// Syntax highlighting, for highlightjs rendered code:

.hljs-string, .hljs-doctag {
color: var(--main-string-color);
}

.hljs-number, .hljs-literal, .hljs-variable, .hljs-template-variable, .hljs-tag .hljs-attr {
color: var(--main-var-color);
}

.hljs-comment, .hljs-quote {
color: var(--main-comment-color);
font-style: italic;
}

.hljs-title, .hljs-section, .hljs-selector-id {
color: var(--main-section-color);
font-weight: bold;
}

.hljs-tag, .hljs-name, .hljs-attribute {
color: var(--main-tag-color);
font-weight: normal;
}

.hljs-keyword, .hljs-selector-tag, .hljs-subst {
color: var(--main-keyword-color);
font-weight: bold;
}

.hljs {
display: block;
overflow-x: auto;
padding: 0.5em;
color: var(--main-text-color);
background: var(--main-code-bg);
}
136 changes: 136 additions & 0 deletions web/styles/_content.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,136 @@
// Copyright (c) 2024, the Dart project authors. Please see the AUTHORS file
// for details. All rights reserved. Use of this source code is governed by a
// BSD-style license that can be found in the LICENSE file.

.main-content {
flex: 1;
order: 2;
overflow-y: scroll;
padding: 10px 20px 0 20px;
}

a {
text-decoration: none;
}

section {
/* Note that the generated HTML for pub packages may have `section` tags
transformed into `div` tags. */
margin-bottom: 36px;
}

dl {
margin: 0;
}

header {
background-color: var(--main-header-color);
box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1);
}

h1,
h2,
h3,
h4,
h5,
h6 {
font-family: Roboto, sans-serif;
font-weight: 400;
margin-top: 1.5em;
color: var(--main-text-color);
}

h1.title {
overflow: hidden;
text-overflow: ellipsis;
}

h1 {
font-size: 37px;
margin-top: 0;
margin-bottom: 0.67em;

@media(max-width: 840px) {
font-size: 24px;
}
}

h2 {
font-size: 28px;
}

h5 {
font-size: 16px;
}

p {
margin-bottom: 1em;
margin-top: 0;
}

a {
color: var(--main-hyperlinks-color);
}

a:hover {
color: #13B9FD;
}

.fixed {
white-space: pre;
}

header a,
header p,
header li {
color: #0175C2;
}

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

header h1 .kind {
color: #555;
}

header h1 {
font-weight: 400;
margin-bottom: 16px;
}

dt {
font-weight: normal;
}

dd {
color: var(--main-text-color);
margin-bottom: 1em;
margin-left: 0;
}

dd.callable, dd.constant, dd.property {
margin-bottom: 24px;
}

dd p {
overflow-x: hidden;
text-overflow: ellipsis;
margin-bottom: 0;
}

table {
margin-bottom: 1em;
}

table,
th,
td {
border: 1px solid lightgrey;
border-collapse: collapse;
}

th,
td {
padding: 8px;
}
9 changes: 9 additions & 0 deletions web/styles/_dartdoc.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
// Copyright (c) 2024, the Dart project authors. Please see the AUTHORS file
// for details. All rights reserved. Use of this source code is governed by a
// BSD-style license that can be found in the LICENSE file.

@forward "dartdoc/category";
@forward "dartdoc/feature";
@forward "dartdoc/members";
@forward "dartdoc/misc";
@forward "dartdoc/signature";
32 changes: 32 additions & 0 deletions web/styles/_footer.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
// Copyright (c) 2024, the Dart project authors. Please see the AUTHORS file
// for details. All rights reserved. Use of this source code is governed by a
// BSD-style license that can be found in the LICENSE file.

footer {
flex: 0 0 16px;
text-align: center;
padding: 16px 20px;
}

footer {
color: #fff;
background-color: var(--main-footer-background);
width: 100%;
}

footer p {
margin: 0;
}

footer .no-break {
white-space: nowrap;
}

footer .container {
padding-left: 0;
padding-right: 0;
}

footer a, footer a:hover {
color: #fff;
}
Loading