aboutsummaryrefslogtreecommitdiff
path: root/public/less/_base.less
diff options
context:
space:
mode:
Diffstat (limited to 'public/less/_base.less')
-rw-r--r--public/less/_base.less748
1 files changed, 377 insertions, 371 deletions
diff --git a/public/less/_base.less b/public/less/_base.less
index a8a8f91a..4a010864 100644
--- a/public/less/_base.less
+++ b/public/less/_base.less
@@ -1,41 +1,46 @@
@footer-margin: 40px;
body:not(.full-width) {
- font-family: "PingFang SC", "Helvetica Neue", "Microsoft YaHei", Arial, Helvetica, sans-serif !important;
- background-color: #fff;
- overflow-y: scroll;
- overflow-x: auto;
- min-width: 1020px;
+ font-family: "Helvetica Neue", "Microsoft YaHei", Arial, Helvetica, sans-serif !important;
+ background-color: #fff;
+ overflow-y: scroll;
+ overflow-x: auto;
+ min-width: 1020px;
}
.ui.container:not(.fluid) {
- width: 980px !important;
+ width: 980px !important;
}
-h1, h2, h3, h4, h5,
+h1,
+h2,
+h3,
+h4,
+h5,
.ui.header,
.ui.menu,
.ui.input input,
.ui.button:not(.label) {
- font-family: "PingFang SC", 'Hiragino Sans GB', "Helvetica Neue", "Microsoft YaHei", Arial, Helvetica, sans-serif !important;
+ font-family: "Helvetica Neue", "Microsoft YaHei", Arial, Helvetica, sans-serif !important;
}
img {
- border-radius: 3px;
+ border-radius: 3px;
}
-pre, code {
- font: 12px Consolas, "Liberation Mono", Menlo, Courier, monospace;
- &.raw {
- padding: 7px 12px;
- margin: 10px 0;
- background-color: #f8f8f8;
- border: 1px solid #ddd;
- border-radius: 3px;
- font-size: 13px;
- line-height: 1.5;
- overflow: auto;
- }
- &.wrap {
- white-space: pre-wrap;
- word-break: break-word;
- }
+pre,
+code {
+ font-family: Consolas, Liberation Mono, Menlo, monospace;
+ &.raw {
+ padding: 7px 12px;
+ margin: 10px 0;
+ background-color: #f8f8f8;
+ border: 1px solid #ddd;
+ border-radius: 3px;
+ font-size: 13px;
+ line-height: 1.5;
+ overflow: auto;
+ }
+ &.wrap {
+ white-space: pre-wrap;
+ word-break: break-word;
+ }
}
.dont-break-out {
/* These are technically the same, but use both */
@@ -55,396 +60,397 @@ pre, code {
hyphens: auto;
}
.full.height {
- padding: 0;
- margin: 0 0 -@footer-margin*2 0;
- min-height: 100%;
+ padding: 0;
+ margin: 0 0 -@footer-margin*2 0;
+ min-height: 100%;
}
.following.bar {
- z-index: 900;
- left: 0;
- width: 100%;
- &.light {
- background-color: white;
- border-bottom: 1px solid #DDDDDD;
- box-shadow: 0 2px 3px rgba(0, 0, 0, 0.04);
- }
- .column .menu {
- margin-top: 0;
- }
- .top.menu a.item.brand {
- padding-left: 0;
+ z-index: 900;
+ left: 0;
+ width: 100%;
+ &.light {
+ background-color: white;
+ border-bottom: 1px solid #dddddd;
+ box-shadow: 0 2px 3px rgba(0, 0, 0, 0.04);
+ }
+ .column .menu {
+ margin-top: 0;
+ }
+ .top.menu a.item.brand {
+ padding-left: 0;
padding-right: 0;
- }
- .brand .ui.mini.image {
- width: 30px;
- }
- .top.menu a.item:hover,
- .top.menu .dropdown.item:hover,
- .top.menu .dropdown.item.active {
- background-color: transparent;
- }
- .top.menu a.item:hover {
- color: rgba(0,0,0,.45);
- }
- .top.menu .menu {
- z-index: 900;
- }
- .icon,
- .octicon {
- margin-right: 5px !important;
- }
- .head.link.item {
- padding-right: 0 !important;
- }
- .avatar > .ui.image {
- margin-right: 0;
- }
- .avatar .octicon-triangle-down {
- margin-top: 6.5px;
- }
- .searchbox {
- background-color: rgb(244, 244, 244) !important;
- &:focus {
- background-color: rgb(233, 233, 233) !important;
- }
- }
- .text .octicon {
- width: 16px;
- text-align: center;
- }
- .right.menu {
- .menu {
- left: auto;
- right: 0;
- }
- .dropdown .menu {
- margin-top: 0;
- }
- }
+ }
+ .brand .ui.mini.image {
+ width: 30px;
+ }
+ .top.menu a.item:hover,
+ .top.menu .dropdown.item:hover,
+ .top.menu .dropdown.item.active {
+ background-color: transparent;
+ }
+ .top.menu a.item:hover {
+ color: rgba(0, 0, 0, 0.45);
+ }
+ .top.menu .menu {
+ z-index: 900;
+ }
+ .icon,
+ .octicon {
+ margin-right: 5px !important;
+ }
+ .head.link.item {
+ padding-right: 0 !important;
+ }
+ .avatar > .ui.image {
+ margin-right: 0;
+ }
+ .avatar .octicon-triangle-down {
+ margin-top: 6.5px;
+ }
+ .searchbox {
+ background-color: rgb(244, 244, 244) !important;
+ &:focus {
+ background-color: rgb(233, 233, 233) !important;
+ }
+ }
+ .text .octicon {
+ width: 16px;
+ text-align: center;
+ }
+ .right.menu {
+ .menu {
+ left: auto;
+ right: 0;
+ }
+ .dropdown .menu {
+ margin-top: 0;
+ }
+ }
}
.ui {
- &.left {
- float: left;
- }
- &.right {
- float: right;
- }
-
- &.container {
- &.fluid {
- &.padded {
- padding: 0 10px 0 10px;
- }
- }
- }
-
- &.form {
- .ui.button {
- font-weight: normal;
- }
- .box.field {
- padding-left: 27px;
- }
- }
-
- &.menu,
- &.vertical.menu,
- &.segment {
- box-shadow: none;
- }
-
- .text {
- &.red {
- color: #d95c5c !important;
- a {
- color: #d95c5c !important;
- &:hover {
- color: #E67777 !important;
- }
- }
- }
- &.blue {
- color: #428bca !important;
- a {
- color: #15c !important;
- &:hover {
- color: #428bca !important;
- }
- }
- }
- &.black {
- color: #444;
- &:hover {
- color: #000;
- }
- }
- &.grey {
- color: #767676 !important;
- a {
- color: #444 !important;
- &:hover {
- color: #000 !important;
- }
- }
- }
- &.light.grey {
- color: #888 !important;
- }
- &.green {
- color: #6cc644 !important;
- }
- &.purple {
- color: #6e5494 !important;
- }
- &.yellow {
- color: #FBBD08 !important;
- }
- &.gold {
- color: #a1882b !important;
- }
-
- &.left {
- text-align: left !important;
- }
- &.right {
- text-align: right !important;
- }
- &.small {
- font-size: 0.75em;
- }
- &.normal {
- font-weight: normal;
- }
- &.bold {
- font-weight: bold;
- }
- &.italic {
- font-style: italic;
- }
-
- &.truncate {
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- display: inline-block;
- }
-
- &.thin {
- font-weight: normal;
- }
-
- &.middle {
- vertical-align: middle;
- }
- }
-
- .message {
- text-align: center;
- }
-
- .header > i + .content {
- padding-left: 0.75rem;
- vertical-align: middle;
- }
- .warning {
- &.header {
- background-color: #F9EDBE !important;
- border-color: #F0C36D;
- }
- &.segment {
- border-color: #F0C36D;
- }
- }
- .info {
- &.segment {
- border: 1px solid #c5d5dd;
- &.top {
- background-color: #e6f1f6 !important;
- h3, h4 {
- margin-top: 0;
- }
- h3:last-child {
- margin-top: 4px;
- }
- > :last-child {
- margin-bottom: 0;
- }
- }
- }
- }
-
- .normal.header {
- font-weight: normal;
- }
-
- .avatar.image {
- border-radius: 3px;
- }
-
- .form {
- .fake {
- display: none !important;
- }
-
- .sub.field {
- margin-left: 25px;
- }
- }
-
- .sha.label {
- font-family: Consolas, Menlo, Monaco, "Lucida Console", monospace;
- font-size: 13px;
- padding: 6px 10px 4px 10px;
- font-weight: normal;
- margin: 0 6px;
- }
-
- &.status.buttons {
- .octicon {
- margin-right: 4px;
- }
- }
-
- &.inline.delete-button {
- padding: 8px 15px;
- font-weight: normal;
- }
+ &.left {
+ float: left;
+ }
+ &.right {
+ float: right;
+ }
+
+ &.container {
+ &.fluid {
+ &.padded {
+ padding: 0 10px 0 10px;
+ }
+ }
+ }
+
+ &.form {
+ .ui.button {
+ font-weight: normal;
+ }
+ .box.field {
+ padding-left: 27px;
+ }
+ }
+
+ &.menu,
+ &.vertical.menu,
+ &.segment {
+ box-shadow: none;
+ }
+
+ .text {
+ &.red {
+ color: #d95c5c !important;
+ a {
+ color: #d95c5c !important;
+ &:hover {
+ color: #e67777 !important;
+ }
+ }
+ }
+ &.blue {
+ color: #428bca !important;
+ a {
+ color: #15c !important;
+ &:hover {
+ color: #428bca !important;
+ }
+ }
+ }
+ &.black {
+ color: #444;
+ &:hover {
+ color: #000;
+ }
+ }
+ &.grey {
+ color: #767676 !important;
+ a {
+ color: #444 !important;
+ &:hover {
+ color: #000 !important;
+ }
+ }
+ }
+ &.light.grey {
+ color: #888 !important;
+ }
+ &.green {
+ color: #6cc644 !important;
+ }
+ &.purple {
+ color: #6e5494 !important;
+ }
+ &.yellow {
+ color: #fbbd08 !important;
+ }
+ &.gold {
+ color: #a1882b !important;
+ }
+
+ &.left {
+ text-align: left !important;
+ }
+ &.right {
+ text-align: right !important;
+ }
+ &.small {
+ font-size: 0.75em;
+ }
+ &.normal {
+ font-weight: normal;
+ }
+ &.bold {
+ font-weight: bold;
+ }
+ &.italic {
+ font-style: italic;
+ }
+
+ &.truncate {
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ display: inline-block;
+ }
+
+ &.thin {
+ font-weight: normal;
+ }
+
+ &.middle {
+ vertical-align: middle;
+ }
+ }
+
+ .message {
+ text-align: center;
+ }
+
+ .header > i + .content {
+ padding-left: 0.75rem;
+ vertical-align: middle;
+ }
+ .warning {
+ &.header {
+ background-color: #f9edbe !important;
+ border-color: #f0c36d;
+ }
+ &.segment {
+ border-color: #f0c36d;
+ }
+ }
+ .info {
+ &.segment {
+ border: 1px solid #c5d5dd;
+ &.top {
+ background-color: #e6f1f6 !important;
+ h3,
+ h4 {
+ margin-top: 0;
+ }
+ h3:last-child {
+ margin-top: 4px;
+ }
+ > :last-child {
+ margin-bottom: 0;
+ }
+ }
+ }
+ }
+
+ .normal.header {
+ font-weight: normal;
+ }
+
+ .avatar.image {
+ border-radius: 3px;
+ }
+
+ .form {
+ .fake {
+ display: none !important;
+ }
+
+ .sub.field {
+ margin-left: 25px;
+ }
+ }
+
+ .sha.label {
+ font-family: Consolas, Liberation Mono, Menlo, monospace;
+ font-size: 13px;
+ padding: 6px 10px 4px 10px;
+ font-weight: normal;
+ margin: 0 6px;
+ }
+
+ &.status.buttons {
+ .octicon {
+ margin-right: 4px;
+ }
+ }
+
+ &.inline.delete-button {
+ padding: 8px 15px;
+ font-weight: normal;
+ }
}
.overflow.menu {
- .items {
- max-height: 300px;
- overflow-y: auto;
- .item {
- position: relative;
- cursor: pointer;
- display: block;
- border: none;
- height: auto;
- border-top: none;
- line-height: 1em;
- color: rgba(0,0,0,.8);
- padding: .71428571em 1.14285714em !important;
- font-size: 1rem;
- text-transform: none;
- font-weight: 400;
- box-shadow: none;
- -webkit-touch-callout: none;
- &.active {
- font-weight: 700;
- }
- &:hover {
- background: rgba(0,0,0,.05);
- color: rgba(0,0,0,.8);
- z-index: 13;
- }
- }
- }
+ .items {
+ max-height: 300px;
+ overflow-y: auto;
+ .item {
+ position: relative;
+ cursor: pointer;
+ display: block;
+ border: none;
+ height: auto;
+ border-top: none;
+ line-height: 1em;
+ color: rgba(0, 0, 0, 0.8);
+ padding: 0.71428571em 1.14285714em !important;
+ font-size: 1rem;
+ text-transform: none;
+ font-weight: 400;
+ box-shadow: none;
+ -webkit-touch-callout: none;
+ &.active {
+ font-weight: 700;
+ }
+ &:hover {
+ background: rgba(0, 0, 0, 0.05);
+ color: rgba(0, 0, 0, 0.8);
+ z-index: 13;
+ }
+ }
+ }
}
.scrolling.menu {
- .item.selected {
- font-weight: 700 !important;
- }
+ .item.selected {
+ font-weight: 700 !important;
+ }
}
footer {
- margin-top: @footer-margin+14px !important;
- height: @footer-margin;
- background-color: white;
- border-top: 1px solid #d6d6d6;
- clear: both;
- width: 100%;
- color: #888888;
- .container {
- padding-top: 10px;
- .fa {
- width: 16px;
- text-align: center;
- color: #428bca;
- }
- .links >* {
- border-left: 1px solid #d6d6d6;
- padding-left: 8px;
- margin-left: 5px;
- &:first-child {
- border-left: none;
- }
- }
- }
-
- .ui.language .menu {
- max-height: 500px;
- overflow-y: auto;
- margin-bottom: 7px;
- }
+ margin-top: @footer-margin+14px !important;
+ height: @footer-margin;
+ background-color: white;
+ border-top: 1px solid #d6d6d6;
+ clear: both;
+ width: 100%;
+ color: #888888;
+ .container {
+ padding-top: 10px;
+ .fa {
+ width: 16px;
+ text-align: center;
+ color: #428bca;
+ }
+ .links > * {
+ border-left: 1px solid #d6d6d6;
+ padding-left: 8px;
+ margin-left: 5px;
+ &:first-child {
+ border-left: none;
+ }
+ }
+ }
+
+ .ui.language .menu {
+ max-height: 500px;
+ overflow-y: auto;
+ margin-bottom: 7px;
+ }
}
.hide {
- display: none;
+ display: none;
}
.display {
- &.inline {
- display: inline;
- }
+ &.inline {
+ display: inline;
+ }
}
.center {
- text-align: center;
+ text-align: center;
}
.no-padding-left {
- padding-left: 0 !important;
+ padding-left: 0 !important;
}
.generate-img(16);
.generate-img(@n, @i: 1) when (@i =< @n) {
- .img-@{i} {
- width: (2px * @i) !important;
- height: (2px * @i) !important;
- }
- .generate-img(@n, (@i + 1));
+ .img-@{i} {
+ width: (2px * @i) !important;
+ height: (2px * @i) !important;
+ }
+ .generate-img(@n, (@i + 1));
}
// Accessibility
.sr-only {
- position: absolute;
- width: 1px;
- height: 1px;
- padding: 0;
- margin: -1px;
- overflow: hidden;
- clip: rect(0, 0, 0, 0);
- border: 0;
+ position: absolute;
+ width: 1px;
+ height: 1px;
+ padding: 0;
+ margin: -1px;
+ overflow: hidden;
+ clip: rect(0, 0, 0, 0);
+ border: 0;
}
.sr-only-focusable:active,
.sr-only-focusable:focus {
- position: static;
- width: auto;
- height: auto;
- margin: 0;
- overflow: visible;
- clip: auto;
+ position: static;
+ width: auto;
+ height: auto;
+ margin: 0;
+ overflow: visible;
+ clip: auto;
}
@media only screen and (max-width: 991px) and (min-width: 768px) {
- .ui.container {
- width: 95%;
- }
+ .ui.container {
+ width: 95%;
+ }
}
/* Overrides some styles of the Highlight.js plugin */
.hljs {
- background: inherit !important;
- padding: 0 !important;
+ background: inherit !important;
+ padding: 0 !important;
}
// Reset CSS to prevent UI breaks
-.ui.dropdown .menu>.item>.image,
-.ui.dropdown .menu>.item>img,
-.ui.dropdown>.text>.image,
-.ui.dropdown>.text>img {
- vertical-align: middle;
- margin-top: 0;
- margin-bottom: 0;
+.ui.dropdown .menu > .item > .image,
+.ui.dropdown .menu > .item > img,
+.ui.dropdown > .text > .image,
+.ui.dropdown > .text > img {
+ vertical-align: middle;
+ margin-top: 0;
+ margin-bottom: 0;
}