Comments (14)
Looking at the git repo everything looks fine. It's the @lumino/default-theme in npm that has the problem. I have no idea how to update that. I think you just need to publish a new version.
According to this, it sounds like everything actually is fine in master...
except for:
(The
.invalid
class name still needs to belm-mod-invalid
, though.)
from lumino.
My apologies. I just double checked my repo and it was pulling and older version. Sorry about that.
from lumino.
Thanks! Do you want to put in a PR fixing this?
from lumino.
It looks like these issues came in with cell editing changes. One thing that also needs to be addressed is the .invalid
class, which should be .lm-mod-invalid
I imagine.
from lumino.
CC also @mbektasbbg
from lumino.
One thing that also needs to be addressed is the
.invalid
class, which should be.lm-mod-invalid
I imagine.
+1. As a general rule, all css classes should be namespaced, which in css means prefixed :(.
from lumino.
Thanks! Do you want to put in a PR fixing this?
Looking at the git repo everything looks fine. It's the @lumino/default-theme in npm that has the problem. I have no idea how to update that. I think you just need to publish a new version.
from lumino.
Wait, is this actually a problem at all?
There was never a cell editor in the Phosphor data grid. So there should be no backward incompatibility with the new classes that have been created. (The .invalid
class name still needs to be lm-mod-invalid
, though.)
from lumino.
I don't think this is an actual backward-incompatible issue, because no consumer of @phosphor/datagrid
ever had these new lm-*
classes. If I am misunderstanding, please let me know. Otherwise, I propose closing this issue.
from lumino.
Yes everything is fine in master but people using the Lumino packages from npm will have some issues.
from lumino.
This is the datagrid.css
file I see in the NPM package for @lumino/default-theme
version 0.2.4. It looks correct to me. It is identical to master
.
/*-----------------------------------------------------------------------------
| Copyright (c) 2014-2018, PhosphorJS Contributors
|
| Distributed under the terms of the BSD 3-Clause License.
|
| The full license is in the file LICENSE, distributed with this software.
|----------------------------------------------------------------------------*/
/* <DEPRECATED> */ .p-DataGrid, /* </DEPRECATED> */
.lm-DataGrid {
min-width: 64px;
min-height: 64px;
border: 1px solid #A0A0A0;
}
/* <DEPRECATED> */ .p-DataGrid-scrollCorner, /* </DEPRECATED> */
.lm-DataGrid-scrollCorner {
background-color: #F0F0F0;
}
/* <DEPRECATED> */ .p-DataGrid-scrollCorner::after, /* </DEPRECATED> */
.lm-DataGrid-scrollCorner::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 1px;
height: 1px;
background-color: #A0A0A0;
}
.lm-DataGrid-cellEditorOccluder {
pointer-events: none;
position: absolute;
overflow: hidden;
}
.lm-DataGrid-cellEditorContainer {
pointer-events: auto;
position: absolute;
background-color: #ffffff;
box-sizing: border-box;
box-shadow: 0px 0px 6px #006bf7;
border: 2px solid #006bf7;
}
.lm-DataGrid-cellEditorContainer.invalid {
box-shadow: 0px 0px 6px red;
border: 2px solid red;
}
.lm-DataGrid-cellEditorContainer > form {
width: 100%;
height: 100%;
overflow: hidden;
}
.lm-DataGrid-cellEditorWidget {
width: 100%;
height: 100%;
outline: none;
box-sizing: border-box;
}
.lm-DataGrid-cellEditorInput {
background-color: #ffffff;
border: 0;
}
.lm-DataGrid-cellEditorCheckbox {
margin: 0;
}
.lm-DataGrid-notification {
position: absolute;
display: flex;
overflow: visible;
animation: fade-in 300ms ease-out;
}
.lm-DataGrid-notificationContainer {
box-shadow: 0px 2px 5px #999999;
border-radius: 3px;
background-color: white;
color: black;
border: 1px solid black;
font-family: sans-serif;
font-size: 13px;
padding: 4px;
}
@keyframes fade-in {
0% {
opacity: 0;
}
50% {
opacity: 0.7;
}
100% {
opacity: 1;
}
}
from lumino.
If you compare the files:
wget https://registry.npmjs.org/@lumino/default-theme/-/default-theme-0.2.4.tgz
wget https://raw.githubusercontent.com/jupyterlab/lumino/master/packages/default-theme/style/datagrid.css
tar -xzf default-theme-0.2.4.tgz
diff package/style/datagrid.css datagrid.css
There is no difference.
from lumino.
Do we still want to use this issue to track .invalid
?
from lumino.
I would suggest opening a new one for the invalid issue so as not to confuse with the amateur mistake I made.
from lumino.
Related Issues (20)
- Drag image is rendered off-screen HOT 3
- MenuBar example is currently broken HOT 5
- Conditional Lumino plugin load HOT 3
- Focus tracker does not focus on tab item HOT 2
- Karma is deprecated we should move on HOT 4
- Auto tab activation
- Tab title edition in Firefox has bugs
- `Tab` and `Shift+Tab` are moving the focus in strange way in `DockPanel`
- Automate link to ReadTheDocs PR preview
- How to persistence SplitPanel and DockPanel? HOT 3
- DockPanel drag & drop HOT 1
- SplitPanel has 0 width and height HOT 8
- How DockPanel set relative sizes?
- Support the selectors with `:is()` and `:where()`
- Menu item not clickable on mobile device unless doing in a quite strange way HOT 2
- New keybinding attribute to indicate shortcuts which prevent default actions HOT 2
- Publishing v2024.3.25 release to NPM failed HOT 1
- Refactor the plugins handling out of the `Application` HOT 5
- copy-paste functionality in an editable DataGrid HOT 2
- Support host and ref options in Menu.open HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from lumino.