Move styling into CSS

This commit is contained in:
Arne Keller 2021-03-07 20:24:08 +01:00
parent 815b1f0bd9
commit c5d146a137
7 changed files with 44 additions and 35 deletions

View File

@ -48,6 +48,7 @@ class MathjaxProofTree extends MathjaxAdapter {
const stepSelector = 'g[typicalc="step"]';
// space between inference premises
const padding = 300;
console.log("calculating steps..");
if (this.shadowRoot !== null) {
console.time('stepCalculation');

View File

@ -0,0 +1,7 @@
#share {
margin-left: auto;
}
#last-step {
margin-right: auto;
}

View File

@ -32,6 +32,7 @@
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
}
#slideShow {
@ -39,9 +40,14 @@
width: 100%;
}
#startpage-footer {
position: sticky;
bottom: 1em;
background-color: white;
#startPage #content {
width: 100%;
height: 100%;
align-items: center;
}
footer {
width: 100%;
padding-bottom: 1em;
background-color: white;
}

View File

@ -1,32 +1,29 @@
#type-inference-view {
width: 100%;
height: 100%;
padding: 0 0 1em;
align-items: center;
width: 100%;
height: 100%;
padding: 0;
align-items: center;
}
#type-inference-view::before {
margin: 0 !important;
margin: 0 !important;
}
#scroller {
width: 100%;
height: 100%;
margin: 0;
}
#content {
display: flex;
flex-direction: column;
height: 100%;
padding: 10px;
box-sizing: border-box;
#type-inference-view #content {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
padding: 10px;
box-sizing: border-box;
margin-top: 0;
}
tc-proof-tree {
border-style: solid;
border-color: #37485f;
border-style: solid;
border-color: #37485f;
}
tc-unification {
background-color: #e9f2fd;
}
background-color: #e9f2fd;
}

View File

@ -1,6 +1,7 @@
package edu.kit.typicalc.view.content;
import com.vaadin.flow.component.button.Button;
import com.vaadin.flow.component.dependency.CssImport;
import com.vaadin.flow.component.icon.Icon;
import com.vaadin.flow.component.icon.VaadinIcon;
import com.vaadin.flow.component.orderedlayout.HorizontalLayout;
@ -10,6 +11,7 @@ import com.vaadin.flow.i18n.LocaleChangeObserver;
/**
* Provides a GUI in form of buttons for the user to navigate through steps.
*/
@CssImport("./styles/view/control-panel.css")
public class ControlPanel extends HorizontalLayout implements LocaleChangeObserver {
private static final String ATTRIBUTE_TITLE = "title";
@ -25,6 +27,7 @@ public class ControlPanel extends HorizontalLayout implements LocaleChangeObserv
private final Button previousStep;
private static final String PREVIOUS_STEP_ID = "previous-step";
private final Button share;
private static final String SHARE_ID = "share";
/**
* Sets up buttons with click-listeners that call the corresponding method in the view.
@ -42,8 +45,7 @@ public class ControlPanel extends HorizontalLayout implements LocaleChangeObserv
previousStep = new Button(new Icon(VaadinIcon.ANGLE_LEFT), evt -> view.previousStepButton());
previousStep.setId(PREVIOUS_STEP_ID);
share = new Button(new Icon(VaadinIcon.CONNECT), evt -> view.shareButton());
share.getStyle().set("margin-left", "auto");
lastStep.getStyle().set("margin-right", "auto");
share.setId(SHARE_ID);
add(share, firstStep, previousStep, nextStep, lastStep);
}

View File

@ -27,6 +27,7 @@ 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";
@ -49,7 +50,10 @@ public class StartPageView extends VerticalLayout implements ControlPanelView, L
* Fills the view with content.
*/
public StartPageView() {
setId(START_PAGE_ID);
VerticalLayout content = new VerticalLayout();
content.setId(CONTENT_ID);
ControlPanel controlPanel = new ControlPanel(this);
controlPanel.setId(CONTROL_PANEL_ID);
controlPanel.setEnabledShareButton(false);
@ -73,16 +77,12 @@ public class StartPageView extends VerticalLayout implements ControlPanelView, L
slideProgress = new ProgressBar(slideShow.getStartPosition(), slideShow.getSlides().length - 1);
slideProgress.setId(SLIDE_PROGRESS_ID);
content.setAlignItems(Alignment.CENTER);
content.add(heading, line1, textContainer, slideProgress, slideShow, line2);
setId(START_PAGE_ID);
Footer footer = new Footer(controlPanel);
footer.setId(FOOTER_ID);
content.setWidthFull();
add(content, footer);
}
private Div createTextContainer() {
Div textContainer = new Div();
textContainer.setId(TEXT_CONTAINER_ID);

View File

@ -69,10 +69,6 @@ public class TypeInferenceView extends VerticalLayout
controlPanel.setEnabledPreviousStep(false);
Footer footer = new Footer(controlPanel);
footer.getStyle().set("position", "sticky");
footer.getStyle().set("bottom", "1em");
content.getStyle().set("overflow", "auto");
content.setWidthFull();
add(content, footer);
}