no-conflict version of shared component styles #18
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,12 @@ | ||
| // This file should be imported wrapped within another less file only. | ||
| // Each of them begin with a `&-`, allowing whatever file that is importing | ||
| // this file to easily namespace all the components at once. | ||
|
|
||
| @import './components/html/index'; | ||
| @import './components/exercise/step-card'; | ||
| @import './components/exercise/group'; | ||
| @import './components/breadcrumbs/step'; | ||
| @import './components/question'; | ||
| @import './components/close'; | ||
| @import './components/spy-mode'; | ||
| @import './components/smart-overflow'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,26 @@ | ||
| // Note: Use tokens instead of strings to be able to do LESS compile-time validation | ||
| .icon-feedback { .x-icon-bg(feedback); } | ||
| .icon-exercise { .x-icon-bg(homework); } | ||
| .icon-homework { .x-icon-bg(homework); } | ||
| .icon-external { .x-icon-bg(external); } | ||
| .icon-event { .x-icon-bg(event); } | ||
| .icon-end { .x-icon-bg(end); } | ||
| .icon-interactive { .x-icon-bg(interactive); } | ||
| .icon-coach { .x-icon-bg(coach); } | ||
| .icon-video { .x-icon-bg(video); } | ||
| .icon-reading { .x-icon-bg(reading); } | ||
| .icon-recover { .x-icon-bg(recover); } | ||
| .icon-test { .x-icon-bg(test); } | ||
| .icon-spaced_practice { .x-icon-bg(review); } | ||
| .icon-personalized { .x-icon-bg(personalized); } | ||
| .icon-worked-example { .x-icon-bg(worked-example); } | ||
|
|
||
| .icon-placeholder { | ||
| &:before { | ||
| content: '?'; | ||
| font-style: normal; | ||
| } | ||
| } | ||
| // The following are usually overlays on other icons | ||
| .icon-correct { .x-icon-bg(correct); } | ||
| .icon-incorrect { .x-icon-bg(incorrect); } | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,37 @@ | ||
| &-breadcrumbs-step { | ||
|
|
||
|
There was a problem hiding this comment. This confuses me. Is it extending whatever the file is included into? Could we make it just be a class like it was before ( [edit] hehe. same Q applies to the other There was a problem hiding this comment. Those files are meant to be wrap-imported only. In the context of where it gets included, the full selector becomes There was a problem hiding this comment. Yeah, ok. I see the intent now. Hm. I guess I'm ok with it for a library 😁 Could you be so kind as to you write a comment on the file explaining it (what you just wrote in the comment is good), so that future me will remember what it's doing ? |
||
| &.completed{ | ||
| .icon-end { .x-icon-bg(completed); } | ||
| } | ||
|
|
||
| .crumb-circle(2rem); | ||
| position: relative; | ||
| font-weight: 500; | ||
| cursor: pointer; | ||
| margin: 2px; | ||
| display: inline-block; | ||
| text-align: center; | ||
| background: @openstax-white; | ||
| color: @openstax-neutral; | ||
|
|
||
|
There was a problem hiding this comment. The roles don't appear to be indented in |
||
| &:hover, | ||
| &.active { | ||
| .openstax-icon-active(1.4, 0.5); | ||
| } | ||
|
|
||
| &.active { | ||
| color: @openstax-primary; | ||
| } | ||
| &.completed { | ||
| background: @openstax-answer-background; | ||
| color: @openstax-answer-color; | ||
| } | ||
| &.status-correct { | ||
| background: @openstax-correct-background; | ||
| color: @openstax-correct-color; | ||
| } | ||
| &.status-incorrect { | ||
| background: @openstax-incorrect-background; | ||
| color: @openstax-incorrect-color; | ||
| } | ||
| } | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,4 +1,4 @@ | ||
| &-close-x { | ||
| &::before { | ||
| content: "\00d7"; | ||
| } | ||
|
|
||
Empty file.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,13 @@ | ||
| &-step-group { | ||
| font-size: 1.6rem; | ||
| color: @openstax-neutral; | ||
| padding-top: 2rem; | ||
| padding-bottom: 0; | ||
| .opacity(0.5); | ||
|
|
||
| } | ||
|
|
||
| &-step-group-label { | ||
| display: inline-block; | ||
| margin-left: 4px; | ||
| } |
Empty file.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,32 @@ | ||
| &-exercise { | ||
| .exercise-typography(); | ||
|
|
||
| @{placeholder-selector} { | ||
| font-style: italic; | ||
| } | ||
|
|
||
| textarea { | ||
| width: 100%; | ||
| min-height: 8em; | ||
| line-height: 1.5em; | ||
| margin: 1em 0; | ||
| padding: 0.75em; | ||
|
|
||
| &[disabled] { | ||
| border: none; | ||
| } | ||
| } | ||
|
|
||
| .exercise-uid { | ||
| position: absolute; | ||
| right: @answer-horizontal-spacing; | ||
| bottom: @answer-vertical-spacing; | ||
| color: @answer-label-color; | ||
| font-size: 1.2rem; | ||
| line-height: 1.2rem; | ||
| } | ||
| } | ||
|
|
||
| &-exercise-card { | ||
| position: relative; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,3 +1,3 @@ | ||
| &-has-html { | ||
| .openstax-tables(); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,15 +1,3 @@ | ||
| body.pinned-shy { | ||
| .pinned-header, .navbar-fixed-top { | ||
| .make-shy(); | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -11,7 +11,7 @@ | |
|
|
||
| .pinned-on { | ||
| .pinned-header { | ||
| top: @openstax-navbar-height; | ||
| .fixed-bar(); | ||
| } | ||
| } | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -127,7 +127,7 @@ | |
| } | ||
|
|
||
|
|
||
| &-question { | ||
|
|
||
| .clearfix(); | ||
|
|
||
|
|
@@ -288,12 +288,3 @@ | |
| } | ||
| } | ||
| } | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,4 +1,4 @@ | ||
| &-smart-overflow { | ||
| overflow-y: auto; | ||
| overflow-x: hidden; | ||
| max-height: none; | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,4 +1,4 @@ | ||
| &-debug-content { | ||
|
|
||
| &.is-enabled { | ||
| .debug-toggle-link { | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think this is fine for now, however a thought occurs to me.
Since
react-componentsis shared between projects, it's non-optimal that Tutor has the icon definitions for ConceptCoach and vice-versa.Perhaps we should make a mixin that the client app could call that would auto generate all these definitions. Something like:
@openstax-icons( feedback, exercise, homework, event, end, ... );The actual mixin is left was an exercise for the reader :) It sucks that it's so difficult to loop in less but http://stackoverflow.com/questions/26585733/less-mixin-how-to-loop-through-passed-in-arguments has examples.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
umm, less/less.js#1857 😄