fix: fix styles for hidden attribute (#464)

fifoosid · web-flow · commit f7f07d23b2d4 · 2019-05-29T16:05:16.000+03:00
diff --git a/packages/main/src/themes/Button.css b/packages/main/src/themes/Button.css
@@ -1,8 +1,8 @@
-:host(ui5-button) {
+:host(ui5-button:not([hidden])) {
 	display: inline-block;
 }
 
-ui5-button {
+ui5-button:not([hidden]) {
 	display: inline-block;
 }
 
diff --git a/packages/main/src/themes/Card.css b/packages/main/src/themes/Card.css
@@ -1,9 +1,9 @@
-:host(ui5-card) {
+:host(ui5-card:not([hidden])) {
 	display: inline-block;
 	width: 100%;
 }
 
-ui5-card {
+ui5-card:not([hidden]) {
 	display: inline-block;
 	width: 100%;
 }
diff --git a/packages/main/src/themes/CheckBox.css b/packages/main/src/themes/CheckBox.css
@@ -1,11 +1,11 @@
-:host(ui5-checkbox) {
+:host(ui5-checkbox:not([hidden])) {
 	display: inline-block;
 	overflow: hidden;
 	max-width: 100%;
 }
 
 /* ducplicated for IE */
-ui5-checkbox {
+ui5-checkbox:not([hidden]) {
 	display: inline-block;
 	overflow: hidden;
 	max-width: 100%;
diff --git a/packages/main/src/themes/CustomListItem.css b/packages/main/src/themes/CustomListItem.css
@@ -2,11 +2,11 @@
 	outline: none;
 }
 
-:host(ui5-li-custom) {
+:host(ui5-li-custom:not([hidden])) {
 	display: block;
 }
 
-ui5-li-custom {
+ui5-li-custom:not([hidden]) {
 	display: block;
 }
 
diff --git a/packages/main/src/themes/DatePicker.css b/packages/main/src/themes/DatePicker.css
@@ -1,9 +1,9 @@
-:host(ui5-datepicker) {
+:host(ui5-datepicker:not([hidden])) {
 	display: inline-block;
 	width: 100%;
 }
 
-ui5-datepicker {
+ui5-datepicker:not([hidden]) {
 	display: inline-block;
 	width: 100%;
 }
diff --git a/packages/main/src/themes/Icon.css b/packages/main/src/themes/Icon.css
@@ -1,4 +1,4 @@
-:host(ui5-icon) {
+:host(ui5-icon:not([hidden])) {
 	display: inline-block;
 	outline: none;
 	color: var(--sapUiContentNonInteractiveIconColor);
@@ -10,7 +10,7 @@
 	height: 100%;
 }
 
-ui5-icon {
+ui5-icon:not([hidden]) {
 	display: inline-block;
 	outline: none;
 	color: var(--sapUiContentNonInteractiveIconColor);
diff --git a/packages/main/src/themes/Input.css b/packages/main/src/themes/Input.css
@@ -1,9 +1,9 @@
-:host(ui5-input) {
+:host(ui5-input:not([hidden])) {
 	display: inline-block;
 	width: 100%;
 }
 
-ui5-input {
+ui5-input:not([hidden]) {
 	display: inline-block;
 	width: 100%;
 }
diff --git a/packages/main/src/themes/Label.css b/packages/main/src/themes/Label.css
@@ -1,4 +1,4 @@
-:host(ui5-label) {
+:host(ui5-label:not([hidden])) {
 	display: inline-block;
 	max-width: 100%;
 	cursor: text;
@@ -8,7 +8,7 @@
 	display: flex;
 }
 
-ui5-label {
+ui5-label:not([hidden]) {
 	display: inline-block;
 	max-width: 100%;
 	overflow: hidden;
diff --git a/packages/main/src/themes/Link.css b/packages/main/src/themes/Link.css
@@ -1,9 +1,9 @@
-:host(ui5-link) {
+:host(ui5-link:not([hidden])) {
 	display: inline-block;
 	max-width: 100%;
 }
 
-:host(ui5-link) span[data-sap-ui-wc-root] {
+:host(ui5-link:not([hidden])) span[data-sap-ui-wc-root] {
 	display: flex;
 }
 
diff --git a/packages/main/src/themes/List.css b/packages/main/src/themes/List.css
@@ -1,9 +1,9 @@
-:host(ui5-list) {
+:host(ui5-list:not([hidden])) {
 	display: block;
 	max-width: 100%;
 }
 
-ui5-list {
+ui5-list:not([hidden]) {
 	display: block;
 	max-width: 100%;
 }
diff --git a/packages/main/src/themes/ListItemBase.css b/packages/main/src/themes/ListItemBase.css
@@ -1,13 +1,13 @@
 
-:host(ui5-li) {
+:host(ui5-li:not([hidden])) {
 	display: block;
 }
 
 :host(ui5-li) .sap-phone .sapMLIB {
 	outline: none;
 }
 
-ui5-li {
+ui5-li:not([hidden]) {
 	display: block;
 }
 
diff --git a/packages/main/src/themes/MessageStrip.css b/packages/main/src/themes/MessageStrip.css
@@ -1,9 +1,9 @@
-:host(ui5-messagestrip) {
+:host(ui5-messagestrip:not([hidden])) {
 	display: inline-block;
 	width: 100%;
 }
 
-ui5-messagestrip {
+ui5-messagestrip:not([hidden]) {
 	display: inline-block;
 	width: 100%;
 }
diff --git a/packages/main/src/themes/MultiComboBox.css b/packages/main/src/themes/MultiComboBox.css
@@ -1,11 +1,11 @@
-:host(ui5-multi-combobox) {
+:host(ui5-multi-combobox:not([hidden])) {
 	display: inline-block;
 	width: 100%;
 
 	--_ui5_popover_content_padding: 0;
 }
 
-ui5-multi-combobox {
+ui5-multi-combobox:not([hidden]) {
 	display: inline-block;
 	width: 100%;
 }
diff --git a/packages/main/src/themes/Panel.css b/packages/main/src/themes/Panel.css
@@ -1,8 +1,8 @@
-:host(ui5-panel) {
+:host(ui5-panel:not([hidden])) {
 	display: block;
 }
 
-ui5-panel {
+ui5-panel:not([hidden]) {
 	display: block;
 }
 
diff --git a/packages/main/src/themes/RadioButton.css b/packages/main/src/themes/RadioButton.css
@@ -1,11 +1,11 @@
-:host(ui5-radiobutton) {
+:host(ui5-radiobutton:not([hidden])) {
 	max-width: 100%;
 	text-overflow: ellipsis;
 	overflow: hidden;
 	display: inline-block;
 }
 
-ui5-radiobutton {
+ui5-radiobutton:not([hidden]) {
 	max-width: 100%;
 	text-overflow: ellipsis;
 	overflow: hidden;
diff --git a/packages/main/src/themes/Select.css b/packages/main/src/themes/Select.css
@@ -1,9 +1,9 @@
-:host(ui5-select) {
+:host(ui5-select:not([hidden])) {
 	display: inline-block;
 	width: 100%;
 }
 
-ui5-select {
+ui5-select:not([hidden]) {
 	display: inline-block;
 	width: 100%;
 }
diff --git a/packages/main/src/themes/ShellBar.css b/packages/main/src/themes/ShellBar.css
@@ -1,9 +1,9 @@
-:host(ui5-shellbar) {
+:host(ui5-shellbar:not([hidden])) {
 	display: inline-block;
 	width: 100%;
 }
 
-ui5-shellbar {
+ui5-shellbar:not([hidden]) {
 	display: inline-block;
 	width: 100%;
 }
diff --git a/packages/main/src/themes/Switch.css b/packages/main/src/themes/Switch.css
@@ -1,10 +1,10 @@
 
 
-:host(ui5-switch) {
+:host(ui5-switch:not([hidden])) {
 	display: inline-block;
 }
 
-ui5-switch {
+ui5-switch:not([hidden]) {
 	display: inline-block;
 }
 
diff --git a/packages/main/src/themes/TabContainer.css b/packages/main/src/themes/TabContainer.css
@@ -1,12 +1,12 @@
 /* ============================= */
 /* Global Base parameters        */
 /* ============================= */
-:host(ui5-tabcontainer) {
+:host(ui5-tabcontainer:not([hidden])) {
 	display: inline-block;
 	width: 100%;
 }
 
-ui5-tabcontainer {
+ui5-tabcontainer:not([hidden]) {
 	width: 100%;
 }
 
diff --git a/packages/main/src/themes/Table.css b/packages/main/src/themes/Table.css
@@ -1,9 +1,9 @@
-:host(ui5-table) {
+:host(ui5-table:not([hidden])) {
 	display: inline-block;
 	width: 100%;
 }
 
-ui5-table {
+ui5-table:not([hidden]) {
 	display: inline-block;
 	width: 100%;
 }
diff --git a/packages/main/src/themes/TableRow.css b/packages/main/src/themes/TableRow.css
@@ -1,9 +1,9 @@
-:host(ui5-table-row) {
+:host(ui5-table-row:not([hidden])) {
 	display: inline-block;
 	width: 100%;
 }
 
-ui5-table-row {
+ui5-table-row:not([hidden]) {
 	display: inline-block;
 	width: 100%;
 }
diff --git a/packages/main/src/themes/TextArea.css b/packages/main/src/themes/TextArea.css
@@ -1,8 +1,8 @@
-:host(ui5-textarea) {
+:host(ui5-textarea:not([hidden])) {
 	display: inline-block;
 }
 
-ui5-textarea {
+ui5-textarea:not([hidden]) {
 	display: inline-block;
 }
 
diff --git a/packages/main/src/themes/Timeline.css b/packages/main/src/themes/Timeline.css
@@ -1,5 +1,8 @@
-ui5-timeline,
-:host(ui5-timeline) {
+:host(ui5-timeline:not([hidden])) {
+	display: block;
+}
+
+ui5-timeline:not([hidden]) {
 	display: block;
 }
 
diff --git a/packages/main/src/themes/TimelineItem.css b/packages/main/src/themes/TimelineItem.css
@@ -1,8 +1,8 @@
-:host(ui5-timeline-item) {
+:host(ui5-timeline-item:not([hidden])) {
 	display: block;
 }
 
-ui5-timeline-item {
+ui5-timeline-item:not([hidden]) {
 	display: block;
 }
 
diff --git a/packages/main/src/themes/Title.css b/packages/main/src/themes/Title.css
@@ -1,10 +1,10 @@
-:host(ui5-title) {
+:host(ui5-title:not([hidden])) {
 	display: block;
 	max-width: 100%;
 	color: var(--sapUiGroupTitleTextColor);
 }
 
-ui5-title {
+ui5-title:not([hidden]) {
 	display: block;
 	overflow: hidden;
 	color: var(--sapUiGroupTitleTextColor);
diff --git a/packages/main/src/themes/ToggleButton.css b/packages/main/src/themes/ToggleButton.css
@@ -1,8 +1,8 @@
-:host(ui5-togglebutton) {
+:host(ui5-togglebutton:not([hidden])) {
 	display: inline-block;
 }
 
-ui5-togglebutton {
+ui5-togglebutton:not([hidden]) {
 	display: inline-block;
 }
 

Original file line number	Diff line number	Diff line change
`@@ -1,8 +1,8 @@`
`1`		`-:host(ui5-button) {`
	`1`	`+:host(ui5-button:not([hidden])) {`
`2`	`2`	`display: inline-block;`
`3`	`3`	`}`
`4`	`4`
`5`		`-ui5-button {`
	`5`	`+ui5-button:not([hidden]) {`
`6`	`6`	`display: inline-block;`
`7`	`7`	`}`
`8`	`8`
Original file line number	Diff line number	Diff line change
`@@ -1,9 +1,9 @@`
`1`		`-:host(ui5-card) {`
	`1`	`+:host(ui5-card:not([hidden])) {`
`2`	`2`	`display: inline-block;`
`3`	`3`	`width: 100%;`
`4`	`4`	`}`
`5`	`5`
`6`		`-ui5-card {`
	`6`	`+ui5-card:not([hidden]) {`
`7`	`7`	`display: inline-block;`
`8`	`8`	`width: 100%;`
`9`	`9`	`}`
Original file line number	Diff line number	Diff line change
`@@ -2,11 +2,11 @@`
`2`	`2`	`outline: none;`
`3`	`3`	`}`
`4`	`4`
`5`		`-:host(ui5-li-custom) {`
	`5`	`+:host(ui5-li-custom:not([hidden])) {`
`6`	`6`	`display: block;`
`7`	`7`	`}`
`8`	`8`
`9`		`-ui5-li-custom {`
	`9`	`+ui5-li-custom:not([hidden]) {`
`10`	`10`	`display: block;`
`11`	`11`	`}`
`12`	`12`
Original file line number	Diff line number	Diff line change
`@@ -1,9 +1,9 @@`
`1`		`-:host(ui5-datepicker) {`
	`1`	`+:host(ui5-datepicker:not([hidden])) {`
`2`	`2`	`display: inline-block;`
`3`	`3`	`width: 100%;`
`4`	`4`	`}`
`5`	`5`
`6`		`-ui5-datepicker {`
	`6`	`+ui5-datepicker:not([hidden]) {`
`7`	`7`	`display: inline-block;`
`8`	`8`	`width: 100%;`
`9`	`9`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1,9 +1,9 @@`
`1`		`-:host(ui5-input) {`
	`1`	`+:host(ui5-input:not([hidden])) {`
`2`	`2`	`display: inline-block;`
`3`	`3`	`width: 100%;`
`4`	`4`	`}`
`5`	`5`
`6`		`-ui5-input {`
	`6`	`+ui5-input:not([hidden]) {`
`7`	`7`	`display: inline-block;`
`8`	`8`	`width: 100%;`
`9`	`9`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1,9 +1,9 @@`
`1`		`-:host(ui5-link) {`
	`1`	`+:host(ui5-link:not([hidden])) {`
`2`	`2`	`display: inline-block;`
`3`	`3`	`max-width: 100%;`
`4`	`4`	`}`
`5`	`5`
`6`		`-:host(ui5-link) span[data-sap-ui-wc-root] {`
	`6`	`+:host(ui5-link:not([hidden])) span[data-sap-ui-wc-root] {`
`7`	`7`	`display: flex;`
`8`	`8`	`}`
`9`	`9`
Original file line number	Diff line number	Diff line change
`@@ -1,9 +1,9 @@`
`1`		`-:host(ui5-list) {`
	`1`	`+:host(ui5-list:not([hidden])) {`
`2`	`2`	`display: block;`
`3`	`3`	`max-width: 100%;`
`4`	`4`	`}`
`5`	`5`
`6`		`-ui5-list {`
	`6`	`+ui5-list:not([hidden]) {`
`7`	`7`	`display: block;`
`8`	`8`	`max-width: 100%;`
`9`	`9`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1,13 +1,13 @@`
`1`	`1`
`2`		`-:host(ui5-li) {`
	`2`	`+:host(ui5-li:not([hidden])) {`
`3`	`3`	`display: block;`
`4`	`4`	`}`
`5`	`5`
`6`	`6`	`:host(ui5-li) .sap-phone .sapMLIB {`
`7`	`7`	`outline: none;`
`8`	`8`	`}`
`9`	`9`
`10`		`-ui5-li {`
	`10`	`+ui5-li:not([hidden]) {`
`11`	`11`	`display: block;`
`12`	`12`	`}`
`13`	`13`
Original file line number	Diff line number	Diff line change
`@@ -1,9 +1,9 @@`
`1`		`-:host(ui5-messagestrip) {`
	`1`	`+:host(ui5-messagestrip:not([hidden])) {`
`2`	`2`	`display: inline-block;`
`3`	`3`	`width: 100%;`
`4`	`4`	`}`
`5`	`5`
`6`		`-ui5-messagestrip {`
	`6`	`+ui5-messagestrip:not([hidden]) {`
`7`	`7`	`display: inline-block;`
`8`	`8`	`width: 100%;`
`9`	`9`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1,11 +1,11 @@`
`1`		`-:host(ui5-multi-combobox) {`
	`1`	`+:host(ui5-multi-combobox:not([hidden])) {`
`2`	`2`	`display: inline-block;`
`3`	`3`	`width: 100%;`
`4`	`4`
`5`	`5`	`--_ui5_popover_content_padding: 0;`
`6`	`6`	`}`
`7`	`7`
`8`		`-ui5-multi-combobox {`
	`8`	`+ui5-multi-combobox:not([hidden]) {`
`9`	`9`	`display: inline-block;`
`10`	`10`	`width: 100%;`
`11`	`11`	`}`