From 78de8f1a1f423a86c05f361e87012a8ea1f1211b Mon Sep 17 00:00:00 2001 From: Yan Zhu Date: Sat, 1 Jul 2017 15:33:02 +0800 Subject: IMPORTANT: Replace all rem units to px --- src/tooltips.less | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) (limited to 'src/tooltips.less') diff --git a/src/tooltips.less b/src/tooltips.less index 25e7bf6..9afeb4d 100644 --- a/src/tooltips.less +++ b/src/tooltips.less @@ -10,14 +10,14 @@ display: block; font-size: @font-size-sm; left: 50%; - max-width: 32rem; + max-width: @control-max-width; opacity: 0; overflow: hidden; - padding: .4rem .8rem; + padding: @unit-1 @unit-2; pointer-events: none; position: absolute; text-overflow: ellipsis; - transform: translate(-50%, 1rem); + transform: translate(-50%, @unit-2); transition: all .2s ease; white-space: nowrap; z-index: @zindex-2; @@ -26,7 +26,7 @@ &:hover { &::after { opacity: 1; - transform: translate(-50%, -.5rem); + transform: translate(-50%, -@unit-1); } } &[disabled], @@ -38,12 +38,12 @@ &::after { bottom: 50%; left: 100%; - transform: translate(-1rem, 50%); + transform: translate(-@unit-1, 50%); } &:focus, &:hover { &::after { - transform: translate(.5rem, 50%); + transform: translate(@unit-1, 50%); } } } @@ -51,12 +51,12 @@ &::after { bottom: auto; top: 100%; - transform: translate(-50%, -1rem); + transform: translate(-50%, -@unit-2); } &:focus, &:hover { &::after { - transform: translate(-50%, .5rem); + transform: translate(-50%, @unit-1); } } } @@ -65,12 +65,12 @@ bottom: 50%; left: auto; right: 100%; - transform: translate(1rem, 50%); + transform: translate(@unit-2, 50%); } &:focus, &:hover { &::after { - transform: translate(-.5rem, 50%); + transform: translate(-@unit-1, 50%); } } } -- cgit v1.3.1-26-gb76a From b15b0cee1110e83a26326dacdbc995364dd07cdb Mon Sep 17 00:00:00 2001 From: Yan Zhu Date: Sun, 13 Aug 2017 16:47:13 +0800 Subject: Completely rewritten Docs experience --- README.md | 2 +- docs/components.html | 238 +++++++++-------- docs/css/docs.css | 349 +++++++++++++++---------- docs/dist/spectre-exp.css | 15 +- docs/dist/spectre-exp.min.css | 2 +- docs/dist/spectre.css | 108 ++++---- docs/dist/spectre.min.css | 2 +- docs/elements.html | 185 +++++++------- docs/experimentals.html | 99 +++---- docs/getting-started.html | 547 +++++++++++++++++++++++++++++++++++++++ docs/img/spectre-logo.svg | 19 ++ docs/index.html | 583 +++++------------------------------------- docs/layout.html | 132 ++++------ docs/src/docs.less | 352 +++++++++++++++---------- docs/utilities.html | 160 +++++------- src/accordions.less | 3 +- src/cards.less | 4 - src/comparison-sliders.less | 5 +- src/forms.less | 1 - src/menus.less | 1 + src/mixins.less | 2 +- src/panels.less | 4 - src/tables.less | 3 + src/tooltips.less | 2 +- src/typography.less | 32 ++- src/utilities/colors.less | 3 - src/utilities/loading.less | 24 +- src/utilities/position.less | 4 +- src/variables.less | 4 +- 29 files changed, 1562 insertions(+), 1323 deletions(-) create mode 100644 docs/getting-started.html create mode 100644 docs/img/spectre-logo.svg (limited to 'src/tooltips.less') diff --git a/README.md b/README.md index 4894b24..a3a2991 100644 --- a/README.md +++ b/README.md @@ -3,7 +3,7 @@ Spectre.css is a lightweight, responsive and modern CSS framework for faster and - Lightweight (~10KB gzipped) starting point for your projects - Flexbox-based, responsive and mobile-friendly layout -- Carefully designed elements and components +- Elegantly designed and developed elements and components Spectre is a side project based on years of CSS development work on a large web service project. Spectre only includes modern base styles, responsive layout system, CSS components and utilities, and it can be modified for your project with LESS compiler. diff --git a/docs/components.html b/docs/components.html index 7089ade..8ea64c9 100644 --- a/docs/components.html +++ b/docs/components.html @@ -12,24 +12,19 @@ -
-
- -
-
- -
-
-