Commit 684327d6 authored by Moritz Dieing's avatar Moritz Dieing
Browse files

Consistent naming of css ids and classes

parent 5277feaf
Pipeline #165916 passed with stages
in 10 minutes and 17 seconds
......@@ -8,7 +8,7 @@ function changeEvent(element: HTMLElement, inputID: string) {
// @ts-ignore
window.buttonListener = (buttonID: string, inputID: string) => {
let replacement = (buttonID === "lambdaButton") ? 'λ' : '';
let replacement = (buttonID === "lambda-button") ? 'λ' : '';
const button = document.getElementById(buttonID)!;
const input = document.getElementById(inputID)!;
button.addEventListener('click', () => {
......
......@@ -10,6 +10,12 @@ vaadin-button, iron-icon, vaadin-drawer-toggle {
cursor: pointer;
}
#closeIcon:hover {
.close-icon {
right: 0;
position: absolute;
bottom: 2.1em;
}
.close-icon:hover {
color: rgb(120, 120, 120);
}
#errorViewContent {
#error-view-content {
align-items: center;
background-color: #ff0000BB;
}
#errorAdditionalInfo {
#error-additional-info {
padding: 0;
margin: 0;
color: white;
font-family: monospace;
}
#errorSummary {
#error-summary {
color: white;
}
#slideLayout {
#slide-layout {
align-items: center;
justify-content: center;
padding: 0;
}
#explanation {
#slide-explanation {
margin-top: 5px;
}
#headingLayout {
#example-heading-layout {
width: 100%;
display: flex;
position: relative;
......@@ -6,13 +6,7 @@
justify-content: center;
}
#closeIcon {
right: 0;
position: absolute;
bottom: 2.1em;
}
#exampleContainer {
#example-container {
padding: 0;
margin: 0;
}
\ No newline at end of file
#contentLayout {
#help-content-layout {
width: 1000px !important;
padding-left: 0;
padding-right: 0;
......@@ -7,7 +7,7 @@
align-items: center;
}
#headingLayout {
#help-heading-layout {
width: 100%;
display: flex;
position: relative;
......@@ -20,13 +20,7 @@
width: 100%;
}
#closeIcon {
right: 0;
position: absolute;
bottom: 2.1em;
}
#typicalcInfo {
#typicalc-info {
padding-top: 24px;
padding-bottom: 24px;
text-align: center;
......
#inferenceRuleField {
#inference-rule-field {
display: flex;
align-items: center;
border: 2px solid #e8e8e8;
......@@ -9,7 +9,7 @@
padding: 0px;
}
#headerField {
#inference-rule-header {
border-bottom: 2px solid #e8e8e8;
background-color: #f8f8f8;
display: grid;
......@@ -20,16 +20,16 @@
border-radius: 5px 5px 0 0;
}
#ruleName {
#rule-name {
margin: 1px;
}
#copyButton {
#copy-button {
margin-left: auto;
margin-right: 10%;
}
#main {
#inference-rule-content {
align-items: center;
justify-content: center;
width: 100%;
......
#infoHeader {
#info-header {
display: flex;
position: relative;
align-items: center;
justify-content: center;
}
#infoContent {
#info-content {
align-items: flex-start;
}
#inputSyntax {
#input-syntax {
font-family: "Courier";
margin-top: 1.5em;
}
#closeIcon {
right: 0;
position: absolute;
bottom: 2.1em;
}
\ No newline at end of file
......@@ -4,12 +4,6 @@
padding-bottom: 0;
}
#inputBar {
align-items: flex-end;
padding: 0 1em;
margin-top: -0.5em;
}
#ass-input-field {
flex-grow: 1;
padding-top: 0;
......
......@@ -4,38 +4,30 @@
align-items: center;
overflow-x: auto;
overflow-y: hidden;
padding: 0.25em;
}
#header img {
border-radius: 50%;
height: var(--lumo-size-s);
margin-left: auto;
margin-right: var(--lumo-space-m);
overflow: hidden;
background-color: var(--lumo-contrast);
}
#viewTitle {
#view-title {
font-size: var(--lumo-font-size-l);
cursor: pointer;
align-self: center;
margin: 0 47% 0.5% 0;
}
#viewTitle a {
#view-title a {
color: var(--lumo-header-text-color);
}
#inputBar {
#input-bar {
width: 75%;
flex-grow: 1;
align-items: flex-end;
padding: 0 1em;
margin-top: -0.5em;
justify-content: end;
}
#helpIcon {
#help-icon {
color: white;
align-self: center;
}
......
......@@ -12,7 +12,7 @@
width: 100%;
}
#headingLayout {
#share-heading-layout {
width: 100%;
max-height: 10%;
display: flex;
......@@ -22,28 +22,6 @@
padding-bottom: 12px;
}
#closeIcon {
right: 0;
position: absolute;
bottom: 2.1em;
}
#url-area-layout {
width: 100%;
}
#package-area-tree-layout {
width: 100%;
}
#package-area-unification-layout {
width: 100%;
}
#latex-area-tree-layout {
width: 100%;
}
#latex-area-unification-layout {
width: 100%;
.copy-button-layout {
width: 100%;
}
#startPage-Heading {
#start-page-heading {
margin-top: 20px;
margin-bottom: 10px;
font-size: 50px;
}
#horizontalLine {
#horizontal-line {
align-self: center;
width: 55em;
max-width: 100%;
min-height: 1px;
}
#textContainer {
#start-text-container {
max-width: 55em;
}
#linkContainer {
#start-link-container {
margin: 0;
}
#slideProgress {
#slide-progress {
width: 55em;
max-width: 100%;
min-height: 1px;
......@@ -27,7 +27,7 @@
margin-bottom: 0;
}
#startPage {
#start-page {
padding: 0;
display: flex;
justify-content: space-between;
......@@ -36,16 +36,16 @@
height: 100%;
}
#slideShow {
#slide-show {
height: var(--paper-slide-height);
width: 100%;
}
#startPage::before {
#start-page::before {
position: absolute;
}
#startPage #content {
#start-page #start-page-content {
width: 100%;
overflow-y: auto;
margin-top: 0;
......
......@@ -77,7 +77,7 @@ tc-explanation {
margin-top: 0;
}
#horizontalLine {
#horizontal-line {
align-self: center;
width: auto;
min-height: 1px;
......
......@@ -23,9 +23,9 @@ import java.util.Optional;
public class ErrorView extends VerticalLayout implements LocaleChangeObserver {
private static final long serialVersionUID = 239587L;
private static final String ERROR_CONTENT_ID = "errorViewContent";
private static final String ADDITIONAL_INFO_ID = "errorAdditionalInfo";
private static final String ERROR_SUMMARY_ID = "errorSummary";
private static final String ERROR_CONTENT_ID = "error-view-content";
private static final String ADDITIONAL_INFO_ID = "error-additional-info";
private static final String ERROR_SUMMARY_ID = "error-summary";
private final H3 heading;
private final Div errorMessage;
......
......@@ -16,8 +16,8 @@ public class ImageSlide extends Slide implements LocaleChangeObserver {
private static final long serialVersionUID = 232255503611054445L;
private static final String SLIDE_LAYOUT_ID = "slideLayout";
private static final String EXPLANATION_ID = "explanation";
private static final String SLIDE_LAYOUT_ID = "slide-layout";
private static final String EXPLANATION_ID = "slide-explanation";
private final VerticalLayout slideLayout;
private final Span explanation;
......
......@@ -27,15 +27,15 @@ public class StartPageView extends VerticalLayout implements ControlPanelView, L
private static final long serialVersionUID = 2502750919087936406L;
private static final String CONTENT_ID = "content";
private static final String HEADING_ID = "startPage-Heading";
private static final String H_LINE_ID = "horizontalLine";
private static final String TEXT_CONTAINER_ID = "textContainer";
private static final String LINK_CONTAINER_ID = "linkContainer";
private static final String SLIDE_PROGRESS_ID = "slideProgress";
private static final String CONTROL_PANEL_ID = "controlPanel";
private static final String START_PAGE_ID = "startPage";
private static final String SLIDE_SHOW_ID = "slideShow";
private static final String CONTENT_ID = "start-page-content";
private static final String HEADING_ID = "start-page-heading";
private static final String H_LINE_ID = "horizontal-line";
private static final String TEXT_CONTAINER_ID = "start-text-container";
private static final String LINK_CONTAINER_ID = "start-link-container";
private static final String SLIDE_PROGRESS_ID = "slide-progress";
private static final String CONTROL_PANEL_ID = "control-panel";
private static final String START_PAGE_ID = "start-page";
private static final String SLIDE_SHOW_ID = "slide-show";
private static final String DOT = ".";
......@@ -62,10 +62,8 @@ public class StartPageView extends VerticalLayout implements ControlPanelView, L
H1 heading = new H1(getTranslation("root.typicalc"));
heading.setId(HEADING_ID);
Hr line1 = new Hr();
line1.setId(H_LINE_ID);
Hr line2 = new Hr();
line2.setId(H_LINE_ID);
Hr line = new Hr();
line.setId(H_LINE_ID);
introduction = new Span();
linkText = new Text(getTranslation("root.linkText"));
......@@ -76,7 +74,7 @@ public class StartPageView extends VerticalLayout implements ControlPanelView, L
slideProgress = new ProgressBar(slideShow.getStartPosition(), slideShow.getSlides().length - 1);
slideProgress.setId(SLIDE_PROGRESS_ID);
content.add(heading, line1, textContainer, slideProgress, slideShow, line2);
content.add(heading, textContainer, slideProgress, slideShow, line);
Footer footer = new Footer(controlPanel);
add(content, footer);
......
......@@ -27,16 +27,12 @@ import java.util.regex.Pattern;
@CssImport("./styles/view/share-dialog.css")
public class ShareDialog extends Dialog implements LocaleChangeObserver {
private static final String HEADING_LAYOUT_ID = "headingLayout";
private static final String SHARE_DIALOG_ID = "shareDialog";
private static final String HEADING_LAYOUT_ID = "share-heading-layout";
private static final String SHARE_DIALOG_ID = "share-dialog";
private static final String LAYOUT_ID = "share-dialog-layout";
private static final String FIELD_CLASS = "share-dialog-field";
private static final String CLOSE_ICON_ID = "closeIcon";
private static final String URL_AREA_LAYOUT_ID = "url-area-layout";
private static final String PACKAGE_AREA_TREE_LAYOUT_ID = "package-area-tree-layout";
private static final String PACKAGE_AREA_UNIFICATION_LAYOUT_ID = "package-area-unification-layout";
private static final String LATEX_AREA_TREE_LAYOUT_ID = "latex-area-tree-layout";
private static final String LATEX_AREA_UNIFICATION_LAYOUT_ID = "latex-area-unification-layout";
private static final String CLOSE_ICON_CLASS = "close-icon";
private static final String COPY_BUTTON_LAYOUT_CLASS = "copy-button-layout";
private static final String RIGHT_ARROW_WHITE = "\\\\rightwhitearrow";
......@@ -62,7 +58,7 @@ public class ShareDialog extends Dialog implements LocaleChangeObserver {
heading = new H3();
Icon closeIcon = new Icon(VaadinIcon.CLOSE_SMALL);
closeIcon.addClickListener(event -> this.close());
closeIcon.setId(CLOSE_ICON_ID);
closeIcon.setClassName(CLOSE_ICON_CLASS);
headingLayout.add(heading);
headingLayout.add(closeIcon);
......@@ -91,15 +87,15 @@ public class ShareDialog extends Dialog implements LocaleChangeObserver {
Button copyButtonLatexAreaUnification = makeCopyButton(latexAreaUnification.getValue());
HorizontalLayout urlLayout = new HorizontalLayout();
urlLayout.setId(URL_AREA_LAYOUT_ID);
urlLayout.setClassName(COPY_BUTTON_LAYOUT_CLASS);
HorizontalLayout packageAreaTreeLayout = new HorizontalLayout();
packageAreaTreeLayout.setId(PACKAGE_AREA_TREE_LAYOUT_ID);
packageAreaTreeLayout.setClassName(COPY_BUTTON_LAYOUT_CLASS);
HorizontalLayout latexAreaTreeLayout = new HorizontalLayout();
latexAreaTreeLayout.setId(LATEX_AREA_TREE_LAYOUT_ID);
latexAreaTreeLayout.setClassName(COPY_BUTTON_LAYOUT_CLASS);
HorizontalLayout packageAreaUnificationLayout = new HorizontalLayout();
packageAreaUnificationLayout.setId(PACKAGE_AREA_UNIFICATION_LAYOUT_ID);
packageAreaUnificationLayout.setClassName(COPY_BUTTON_LAYOUT_CLASS);
HorizontalLayout latexAreaUnificationLayout = new HorizontalLayout();
latexAreaUnificationLayout.setId(LATEX_AREA_UNIFICATION_LAYOUT_ID);
latexAreaUnificationLayout.setClassName(COPY_BUTTON_LAYOUT_CLASS);
urlLayout.add(urlField, copyButtonUrl);
packageAreaTreeLayout.add(packageAreaTree, copyButtonPackageAreaTree);
......
......@@ -57,7 +57,7 @@ public class TypeInferenceView extends VerticalLayout
private static final String HOVER_BUTTON_CLASS = "hovering-button";
private static final String RULES_BUTTON_ID = "rules-button";
private static final String EXPLANATION_TEXT_BUTTON_ID = "explanation-text-button";
private static final String H_LINE_ID = "horizontalLine";
private static final String H_LINE_ID = "horizontal-line";
private static final String FOOTER_ID = "footer";
private List<Integer> treeNumbers;
......
......@@ -24,10 +24,10 @@ import com.vaadin.flow.i18n.LocaleChangeObserver;
public class ExampleDialog extends Dialog implements LocaleChangeObserver {
private static final long serialVersionUID = -428675165625776559L;
private static final String HEADING_LAYOUT_ID = "headingLayout";
private static final String EXAMPLE_DIALOG_ID = "exampleDialog";
private static final String CLOSE_ICON_ID = "closeIcon";
private static final String EXAMPLE_CONTAINER_ID = "exampleContainer";
private static final String HEADING_LAYOUT_ID = "example-heading-layout";
private static final String EXAMPLE_DIALOG_ID = "example-dialog";
private static final String CLOSE_ICON_CLASS = "close-icon";
private static final String EXAMPLE_CONTAINER_ID = "example-container";
private final H3 instruction;
private final transient Consumer<Pair<String, String>> setExamples;
......@@ -49,7 +49,7 @@ public class ExampleDialog extends Dialog implements LocaleChangeObserver {
Icon closeIcon = new Icon(VaadinIcon.CLOSE_SMALL);
closeIcon.addClickListener(event -> this.close());
closeIcon.setId(CLOSE_ICON_ID);
closeIcon.setClassName(CLOSE_ICON_CLASS);
headingLayout.add(instruction);
headingLayout.add(closeIcon);
......
......@@ -23,11 +23,11 @@ public class HelpDialog extends Dialog implements LocaleChangeObserver {
/*
* IDs for the imported .css-file
*/
private static final String HEADING_LAYOUT_ID = "headingLayout";
private static final String CONTENT_LAYOUT_ID = "contentLayout";
private static final String HEADING_LAYOUT_ID = "help-heading-layout";
private static final String CONTENT_LAYOUT_ID = "help-content-layout";
private static final String ACCORDION_ID = "accordion";
private static final String CLOSE_ICON_ID = "closeIcon";
private static final String TYPICALC_INFO_ID = "typicalcInfo";
private static final String CLOSE_ICON_CLASS = "close-icon";
private static final String TYPICALC_INFO_ID = "typicalc-info";
private final H3 heading;
private final Paragraph typicalcInfo;
......@@ -43,7 +43,7 @@ public class HelpDialog extends Dialog implements LocaleChangeObserver {
Icon closeIcon = new Icon(VaadinIcon.CLOSE_SMALL);
closeIcon.addClickListener(event -> this.close());
closeIcon.setId(CLOSE_ICON_ID);
closeIcon.setClassName(CLOSE_ICON_CLASS);
headingLayout.add(heading, closeIcon);
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment