Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feat/avro #81

Merged
merged 11 commits into from
Aug 28, 2024
Prev Previous commit
Next Next commit
feat: w-16216523. Align Array to the top
  • Loading branch information
spezzirriemiliano committed Aug 14, 2024
commit 4ca0fde64a47df082a9388d07b491722b5f0a2a5
22 changes: 19 additions & 3 deletions src/PropertyShapeDocument.js
Original file line number Diff line number Diff line change
@@ -870,9 +870,11 @@ export class PropertyShapeDocument extends PropertyDocumentMixin(LitElement) {
propertyName,
parentTypeName,
hasParentTypeName,
isComplex,
avroValue
} = this;
if(!hasDisplayName && !propertyName && this.isComplex && this.avroValue){
return html`<div class="property-display-name">${this.avroValue}</div>`
if(!hasDisplayName && !propertyName && isComplex && avroValue){
return html`<div class="property-display-name">${avroValue}</div>`
}
return html` ${hasDisplayName
? html`<div class="property-display-name">${displayName}</div>`
@@ -894,6 +896,20 @@ export class PropertyShapeDocument extends PropertyDocumentMixin(LitElement) {
return html`<div class="deprecated-warning">Warning: Deprecated</div>`
}

_noNameAvroClass() {
const {
hasDisplayName,
propertyName,
isComplex,
avroValue,
_renderToggleButton
} = this;
if(!hasDisplayName && !propertyName && isComplex && !avroValue && _renderToggleButton){
return ' no-name'
}
return ''
}

/**
* @return {TemplateResult} Main render function.
*/
@@ -902,7 +918,7 @@ export class PropertyShapeDocument extends PropertyDocumentMixin(LitElement) {
${this.styles}
</style>
${this._headerTemplate()}
<div class="property-traits">
<div class="property-traits${this._noNameAvroClass()}">
${this._getTypeNameTemplate()}
${this.isRequired
? html`<span
55 changes: 16 additions & 39 deletions src/ShapeStyles.js
Original file line number Diff line number Diff line change
@@ -1,17 +1,11 @@
import { css } from 'lit-element';
import { css } from "lit-element";

export default css`
:host {
display: block;
border-bottom-width: 1px;
border-bottom-color: var(
--property-shape-document-border-bottom-color,
#cfd8dc
);
border-bottom-style: var(
--property-shape-document-border-bottom-style,
dashed
);
border-bottom-color: var(--property-shape-document-border-bottom-color, #cfd8dc);
border-bottom-style: var(--property-shape-document-border-bottom-style, dashed);
padding: var(--property-shape-document-padding);
}

@@ -24,38 +18,20 @@ export default css`
}

.property-title {
font-family: var(
--property-shape-document-title-font-family,
var(--arc-font-subhead-font-family)
);
font-size: var(
--property-shape-document-title-font-size,
var(--arc-font-subhead-font-size, 1rem)
);
font-weight: var(
--property-shape-document-title-font-weight,
var(--arc-font-subhead-font-weight)
);
line-height: var(
--property-shape-document-title-line-height,
var(--arc-font-subhead-line-height)
);

margin: var(
--property-shape-document-title-margin,
4px 0 4px 0
);
font-family: var(--property-shape-document-title-font-family, var(--arc-font-subhead-font-family));
font-size: var(--property-shape-document-title-font-size, var(--arc-font-subhead-font-size, 1rem));
font-weight: var(--property-shape-document-title-font-weight, var(--arc-font-subhead-font-weight));
line-height: var(--property-shape-document-title-line-height, var(--arc-font-subhead-line-height));

margin: var(--property-shape-document-title-margin, 4px 0 4px 0);
font-size: 1rem;
font-weight: var(--api-type-document-property-title-font-weight, 500);
word-break: break-word;
color: var(--api-type-document-property-title-color);
}

.property-title[secondary] {
font-weight: var(
--api-type-document-property-title-secondary-font-weight,
400
);
font-weight: var(--api-type-document-property-title-secondary-font-weight, 400);
color: var(--api-type-document-property-title-secondary-color, #616161);
}

@@ -65,10 +41,7 @@ export default css`

.property-display-name {
font-weight: var(--api-type-document-property-name-font-weight, 500);
color: var(
--api-type-document-property-name-color,
var(--api-type-document-property-color, #212121)
);
color: var(--api-type-document-property-name-color, var(--api-type-document-property-color, #212121));
margin: 4px 0 4px 0;
font-size: var(--api-type-document-property-name-font-size, 16px);
}
@@ -117,6 +90,10 @@ export default css`
margin-bottom: 8px;
}

.property-traits.no-name {
margin-top: -33px;
}

.property-traits > span {
display: inline-block;
margin-right: 8px;
@@ -163,7 +140,7 @@ export default css`
-ms-flex: 1;
flex: 1;
}

.property-traits > span.readonly-type {
background-color: var(--api-type-readonly-property-background-color, #ff9292);
color: var(--api-type-readonly-property-color, black);