mirror of
https://gitlab.kit.edu/uskyk/typicalc.git
synced 2024-11-09 10:50:42 +00:00
Move styling into CSS
This commit is contained in:
parent
815b1f0bd9
commit
c5d146a137
@ -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');
|
||||
|
7
frontend/styles/view/control-panel.css
Normal file
7
frontend/styles/view/control-panel.css
Normal file
@ -0,0 +1,7 @@
|
||||
#share {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
#last-step {
|
||||
margin-right: auto;
|
||||
}
|
@ -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;
|
||||
}
|
||||
|
@ -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;
|
||||
}
|
||||
|
@ -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);
|
||||
}
|
||||
|
@ -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);
|
||||
|
@ -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);
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user