mirror of
https://github.com/spring-projects/spring-petclinic.git
synced 2025-07-15 20:25:50 +00:00
Convert to SCSS and Bootstrap 5
This commit is contained in:
Dave Syer
Dave Syer
parent
4f2f8fab73
commit
1095a15f0e
23 changed files with 477 additions and 341 deletions
2
.gitignore
vendored
2
.gitignore
vendored
|
|
@ -10,3 +10,5 @@ target/*
|
|||
.sts4-cache/
|
||||
.vscode
|
||||
_site/
|
||||
node/
|
||||
node_modules/
|
||||
|
|
|
|||
4
npm
Executable file
4
npm
Executable file
|
|
@ -0,0 +1,4 @@
|
|||
#!/bin/sh
|
||||
cd $(dirname $0)
|
||||
PATH="$PWD/node/":$PATH
|
||||
node "node/node_modules/npm/bin/npm-cli.js" "$@"
|
||||
151
package-lock.json
generated
Normal file
151
package-lock.json
generated
Normal file
|
|
@ -0,0 +1,151 @@
|
|||
{
|
||||
"requires": true,
|
||||
"lockfileVersion": 1,
|
||||
"dependencies": {
|
||||
"@popperjs/core": {
|
||||
"version": "2.10.2",
|
||||
"resolved": "https://registry.npmjs.org/@popperjs/core/-/core-2.10.2.tgz",
|
||||
"integrity": "sha512-IXf3XA7+XyN7CP9gGh/XB0UxVMlvARGEgGXLubFICsUMGz6Q+DU+i4gGlpOxTjKvXjkJDJC8YdqdKkDj9qZHEQ=="
|
||||
},
|
||||
"anymatch": {
|
||||
"version": "3.1.2",
|
||||
"resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.2.tgz",
|
||||
"integrity": "sha512-P43ePfOAIupkguHUycrc4qJ9kz8ZiuOUijaETwX7THt0Y/GNK7v0aa8rY816xWjZ7rJdA5XdMcpVFTKMq+RvWg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"normalize-path": "3.0.0",
|
||||
"picomatch": "2.3.0"
|
||||
}
|
||||
},
|
||||
"binary-extensions": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
|
||||
"integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
|
||||
"dev": true
|
||||
},
|
||||
"bootstrap": {
|
||||
"version": "5.1.3",
|
||||
"resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-5.1.3.tgz",
|
||||
"integrity": "sha512-fcQztozJ8jToQWXxVuEyXWW+dSo8AiXWKwiSSrKWsRB/Qt+Ewwza+JWoLKiTuQLaEPhdNAJ7+Dosc9DOIqNy7Q=="
|
||||
},
|
||||
"braces": {
|
||||
"version": "3.0.2",
|
||||
"resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
|
||||
"integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"fill-range": "7.0.1"
|
||||
}
|
||||
},
|
||||
"chokidar": {
|
||||
"version": "3.5.2",
|
||||
"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.2.tgz",
|
||||
"integrity": "sha512-ekGhOnNVPgT77r4K/U3GDhu+FQ2S8TnK/s2KbIGXi0SZWuwkZ2QNyfWdZW+TVfn84DpEP7rLeCt2UI6bJ8GwbQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"anymatch": "3.1.2",
|
||||
"braces": "3.0.2",
|
||||
"fsevents": "2.3.2",
|
||||
"glob-parent": "5.1.2",
|
||||
"is-binary-path": "2.1.0",
|
||||
"is-glob": "4.0.3",
|
||||
"normalize-path": "3.0.0",
|
||||
"readdirp": "3.6.0"
|
||||
}
|
||||
},
|
||||
"fill-range": {
|
||||
"version": "7.0.1",
|
||||
"resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
|
||||
"integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"to-regex-range": "5.0.1"
|
||||
}
|
||||
},
|
||||
"fsevents": {
|
||||
"version": "2.3.2",
|
||||
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
|
||||
"integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
|
||||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"glob-parent": {
|
||||
"version": "5.1.2",
|
||||
"resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
|
||||
"integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"is-glob": "4.0.3"
|
||||
}
|
||||
},
|
||||
"is-binary-path": {
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
|
||||
"integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"binary-extensions": "2.2.0"
|
||||
}
|
||||
},
|
||||
"is-extglob": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
|
||||
"integrity": "sha1-qIwCU1eR8C7TfHahueqXc8gz+MI=",
|
||||
"dev": true
|
||||
},
|
||||
"is-glob": {
|
||||
"version": "4.0.3",
|
||||
"resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
|
||||
"integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"is-extglob": "2.1.1"
|
||||
}
|
||||
},
|
||||
"is-number": {
|
||||
"version": "7.0.0",
|
||||
"resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
|
||||
"integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
|
||||
"dev": true
|
||||
},
|
||||
"normalize-path": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
|
||||
"integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
|
||||
"dev": true
|
||||
},
|
||||
"picomatch": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.0.tgz",
|
||||
"integrity": "sha512-lY1Q/PiJGC2zOv/z391WOTD+Z02bCgsFfvxoXXf6h7kv9o+WmsmzYqrAwY63sNgOxE4xEdq0WyUnXfKeBrSvYw==",
|
||||
"dev": true
|
||||
},
|
||||
"readdirp": {
|
||||
"version": "3.6.0",
|
||||
"resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
|
||||
"integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"picomatch": "2.3.0"
|
||||
}
|
||||
},
|
||||
"sass": {
|
||||
"version": "1.43.4",
|
||||
"resolved": "https://registry.npmjs.org/sass/-/sass-1.43.4.tgz",
|
||||
"integrity": "sha512-/ptG7KE9lxpGSYiXn7Ar+lKOv37xfWsZRtFYal2QHNigyVQDx685VFT/h7ejVr+R8w7H4tmUgtulsKl5YpveOg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"chokidar": "3.5.2"
|
||||
}
|
||||
},
|
||||
"to-regex-range": {
|
||||
"version": "5.0.1",
|
||||
"resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
|
||||
"integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"is-number": "7.0.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
12
package.json
Normal file
12
package.json
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
{
|
||||
"dependencies": {
|
||||
"bootstrap": "^5.1.3",
|
||||
"@popperjs/core": "^2.10.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"sass": "^1.43.4"
|
||||
},
|
||||
"scripts": {
|
||||
"build": "sass --style expanded --source-map --embed-sources --no-error-css src/main/scss/:target/classes/static/resources/css/"
|
||||
}
|
||||
}
|
||||
74
pom.xml
74
pom.xml
|
|
@ -22,14 +22,17 @@
|
|||
<project.reporting.outputEncoding>UTF-8</project.reporting.outputEncoding>
|
||||
|
||||
<!-- Web dependencies -->
|
||||
<webjars-bootstrap.version>3.3.6</webjars-bootstrap.version>
|
||||
<webjars-jquery-ui.version>1.11.4</webjars-jquery-ui.version>
|
||||
<webjars-jquery.version>2.2.4</webjars-jquery.version>
|
||||
<webjars-bootstrap.version>5.1.3</webjars-bootstrap.version>
|
||||
<font-awesome.version>4.7.0</font-awesome.version>
|
||||
<jquery.version>3.4.1</jquery.version>
|
||||
<jquery-ui.version>1.13.0</jquery-ui.version>
|
||||
<wro4j.version>1.8.0</wro4j.version>
|
||||
|
||||
<jacoco.version>0.8.5</jacoco.version>
|
||||
<node.version>v8.11.1</node.version>
|
||||
<nohttp-checkstyle.version>0.0.4.RELEASE</nohttp-checkstyle.version>
|
||||
<spring-format.version>0.0.25</spring-format.version>
|
||||
<frontend-maven-plugin.version>1.12.0</frontend-maven-plugin.version>
|
||||
</properties>
|
||||
|
||||
<dependencies>
|
||||
|
|
@ -100,18 +103,23 @@
|
|||
<dependency>
|
||||
<groupId>org.webjars</groupId>
|
||||
<artifactId>jquery</artifactId>
|
||||
<version>${webjars-jquery.version}</version>
|
||||
<version>${jquery.version}</version>
|
||||
</dependency>
|
||||
<dependency>
|
||||
<groupId>org.webjars</groupId>
|
||||
<artifactId>jquery-ui</artifactId>
|
||||
<version>${webjars-jquery-ui.version}</version>
|
||||
<version>${jquery-ui.version}</version>
|
||||
</dependency>
|
||||
<dependency>
|
||||
<groupId>org.webjars</groupId>
|
||||
<groupId>org.webjars.npm</groupId>
|
||||
<artifactId>bootstrap</artifactId>
|
||||
<version>${webjars-bootstrap.version}</version>
|
||||
</dependency>
|
||||
<dependency>
|
||||
<groupId>org.webjars.npm</groupId>
|
||||
<artifactId>font-awesome</artifactId>
|
||||
<version>${font-awesome.version}</version>
|
||||
</dependency>
|
||||
<!-- end of webjars -->
|
||||
|
||||
<dependency>
|
||||
|
|
@ -235,38 +243,42 @@
|
|||
</plugin>
|
||||
|
||||
<plugin>
|
||||
<groupId>ro.isdc.wro4j</groupId>
|
||||
<artifactId>wro4j-maven-plugin</artifactId>
|
||||
<version>${wro4j.version}</version>
|
||||
<groupId>com.github.eirslett</groupId>
|
||||
<artifactId>frontend-maven-plugin</artifactId>
|
||||
<version>${frontend-maven-plugin.version}</version>
|
||||
<executions>
|
||||
<execution>
|
||||
<phase>generate-resources</phase>
|
||||
<?m2e execute onConfiguration,onIncremental?>
|
||||
<id>install node and npm</id>
|
||||
<goals>
|
||||
<goal>run</goal>
|
||||
<goal>install-node-and-npm</goal>
|
||||
</goals>
|
||||
<configuration>
|
||||
<nodeVersion>${node.version}</nodeVersion>
|
||||
<npmVersion>${npm.version}</npmVersion>
|
||||
</configuration>
|
||||
</execution>
|
||||
<execution>
|
||||
<id>npm install</id>
|
||||
<goals>
|
||||
<goal>npm</goal>
|
||||
</goals>
|
||||
<configuration>
|
||||
<arguments>install</arguments>
|
||||
</configuration>
|
||||
</execution>
|
||||
<execution>
|
||||
<id>build</id>
|
||||
<goals>
|
||||
<goal>npm</goal>
|
||||
</goals>
|
||||
<configuration>
|
||||
<arguments>run-script build</arguments>
|
||||
</configuration>
|
||||
<phase>generate-resources</phase>
|
||||
</execution>
|
||||
</executions>
|
||||
<configuration>
|
||||
<wroManagerFactory>ro.isdc.wro.maven.plugin.manager.factory.ConfigurableWroManagerFactory</wroManagerFactory>
|
||||
<cssDestinationFolder>${project.build.directory}/classes/static/resources/css</cssDestinationFolder>
|
||||
<wroFile>${basedir}/src/main/wro/wro.xml</wroFile>
|
||||
<extraConfigFile>${basedir}/src/main/wro/wro.properties</extraConfigFile>
|
||||
<contextFolder>${basedir}/src/main/less</contextFolder>
|
||||
</configuration>
|
||||
<dependencies>
|
||||
<dependency>
|
||||
<groupId>org.webjars</groupId>
|
||||
<artifactId>bootstrap</artifactId>
|
||||
<version>${webjars-bootstrap.version}</version>
|
||||
</dependency>
|
||||
<dependency>
|
||||
<groupId>org.mockito</groupId>
|
||||
<artifactId>mockito-core</artifactId>
|
||||
<version>${mockito.version}</version>
|
||||
</dependency>
|
||||
</dependencies>
|
||||
</plugin>
|
||||
|
||||
</plugins>
|
||||
</build>
|
||||
|
||||
|
|
|
|||
|
|
@ -3,6 +3,8 @@
|
|||
"-//Checkstyle//DTD SuppressionFilter Configuration 1.2//EN"
|
||||
"https://checkstyle.org/dtds/suppressions_1_2.dtd">
|
||||
<suppressions>
|
||||
<suppress files="node_modules/.*" checks=".*"/>
|
||||
<suppress files="node/.*" checks=".*"/>
|
||||
<suppress files="[\\/]build.log" checks="NoHttp"/>
|
||||
<suppress files=".+\.(jar|git|ico|p12|gif|jks|jpg|svg)" checks="NoHttp"/>
|
||||
</suppressions>
|
||||
|
|
|
|||
|
|
@ -1,239 +0,0 @@
|
|||
/*
|
||||
* Copyright 2016 the original author or authors.
|
||||
*
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* https://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
@icon-font-path: "../../webjars/bootstrap/fonts/";
|
||||
|
||||
@spring-green: #6db33f;
|
||||
@spring-dark-green: #5fa134;
|
||||
@spring-brown: #34302D;
|
||||
@spring-grey: #838789;
|
||||
@spring-light-grey: #f1f1f1;
|
||||
|
||||
@body-bg: @spring-light-grey;
|
||||
@text-color: @spring-brown;
|
||||
@link-color: @spring-dark-green;
|
||||
@link-hover-color: @spring-dark-green;
|
||||
|
||||
@navbar-default-link-color: @spring-light-grey;
|
||||
@navbar-default-link-active-color: @spring-light-grey;
|
||||
@navbar-default-link-hover-color: @spring-light-grey;
|
||||
@navbar-default-link-hover-bg: @spring-green;
|
||||
@navbar-default-toggle-icon-bar-bg: @spring-light-grey;
|
||||
@navbar-default-toggle-hover-bg: transparent;
|
||||
@navbar-default-link-active-bg: @spring-green;
|
||||
|
||||
@border-radius-base: 0;
|
||||
@border-radius-large: 0;
|
||||
@border-radius-small: 0;
|
||||
|
||||
@btn-default-color: @spring-light-grey;
|
||||
@btn-default-bg: @spring-brown;
|
||||
@btn-default-border: @spring-green;
|
||||
|
||||
@nav-tabs-active-link-hover-color: @spring-light-grey;
|
||||
@nav-tabs-active-link-hover-bg: @spring-brown;
|
||||
@nav-tabs-active-link-hover-border-color: @spring-brown;
|
||||
@nav-tabs-border-color: @spring-brown;
|
||||
|
||||
@pagination-active-bg: @spring-brown;
|
||||
@pagination-active-border: @spring-green;
|
||||
@table-border-color: @spring-brown;
|
||||
|
||||
.table > thead > tr > th {
|
||||
background-color: lighten(@spring-brown, 3%);
|
||||
color: @spring-light-grey;
|
||||
}
|
||||
|
||||
.table-filter {
|
||||
background-color: @spring-brown;
|
||||
padding: 9px 12px;
|
||||
}
|
||||
|
||||
.nav > li > a {
|
||||
color: @spring-grey;
|
||||
}
|
||||
|
||||
.btn-default {
|
||||
border-width: 2px;
|
||||
transition: border 0.15s;
|
||||
-webkit-transition: border 0.15s;
|
||||
-moz-transition: border 0.15s;
|
||||
-o-transition: border 0.15s;
|
||||
-ms-transition: border 0.15s;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&.active,
|
||||
.open .dropdown-toggle& {
|
||||
background-color: @spring-brown;
|
||||
border-color: @spring-brown;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.container .text-muted {
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
code {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
.xd-container {
|
||||
margin-top: 40px;
|
||||
margin-bottom: 100px;
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin-bottom: 15px
|
||||
}
|
||||
|
||||
.index-page--subtitle {
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
margin: 0 0 30px;
|
||||
}
|
||||
|
||||
.form-horizontal button.btn-inverse {
|
||||
margin-left: 32px;
|
||||
}
|
||||
|
||||
#job-params-modal .modal-dialog {
|
||||
width: 90%;
|
||||
margin-left:auto;
|
||||
margin-right:auto;
|
||||
}
|
||||
|
||||
[ng-cloak].splash {
|
||||
display: block !important;
|
||||
}
|
||||
[ng-cloak] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.splash {
|
||||
background: @spring-green;
|
||||
color: @spring-brown;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.error-page {
|
||||
margin-top: 100px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.error-page .error-title {
|
||||
font-size: 24px;
|
||||
line-height: 24px;
|
||||
margin: 30px 0 0;
|
||||
}
|
||||
|
||||
table td {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
table td .progress {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
table td.action-column {
|
||||
width: 1px;
|
||||
}
|
||||
|
||||
.help-block {
|
||||
color: lighten(@text-color, 50%); // lighten the text some for contrast
|
||||
}
|
||||
|
||||
.xd-containers {
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.cluster-view > table td {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.cluster-view .label, .cluster-view .column-block {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.cluster-view .input-group-addon {
|
||||
width: 0%;
|
||||
}
|
||||
|
||||
.cluster-view {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.deployment-status-deployed {
|
||||
.label-success;
|
||||
}
|
||||
|
||||
.deployment-status-incomplete {
|
||||
.label-warning;
|
||||
}
|
||||
|
||||
.deployment-status-failed {
|
||||
.label-danger;
|
||||
}
|
||||
|
||||
.deployment-status-deploying {
|
||||
.label-info
|
||||
}
|
||||
.deployment-status-na {
|
||||
}
|
||||
|
||||
.container-details-table th {
|
||||
background-color: lighten(@spring-brown, 3%);
|
||||
color: @spring-light-grey;
|
||||
}
|
||||
|
||||
.status-help-content-table td {
|
||||
color: @spring-brown;
|
||||
}
|
||||
|
||||
.alert-success {
|
||||
.alert-variant(fade(@alert-success-bg, 70%); @alert-success-border; @alert-success-text);
|
||||
}
|
||||
.alert-info {
|
||||
.alert-variant(fade(@alert-info-bg, 70%); @alert-info-border; @alert-info-text);
|
||||
}
|
||||
.alert-warning {
|
||||
.alert-variant(fade(@alert-warning-bg, 70%); @alert-warning-border; @alert-warning-text);
|
||||
}
|
||||
.alert-danger {
|
||||
.alert-variant(fade(@alert-danger-bg, 70%); @alert-danger-border; @alert-danger-text);
|
||||
}
|
||||
|
||||
.myspinner {
|
||||
animation-name: spinner;
|
||||
animation-duration: 2s;
|
||||
animation-iteration-count: infinite;
|
||||
animation-timing-function: linear;
|
||||
|
||||
-webkit-transform-origin: 49% 50%;
|
||||
-webkit-animation-name: spinner;
|
||||
-webkit-animation-duration: 2s;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-webkit-animation-timing-function: linear;
|
||||
}
|
||||
|
||||
hr {
|
||||
border-top: 1px dotted @spring-brown;
|
||||
}
|
||||
|
||||
@import "typography.less";
|
||||
@import "header.less";
|
||||
@import "responsive.less";
|
||||
|
|
@ -14,11 +14,11 @@
|
|||
pattern="(?:19|20)[0-9]{2}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-9])|(?:(?!02)(?:0[1-9]|1[0-2])-(?:30))|(?:(?:0[13578]|1[02])-31))"/>
|
||||
</div>
|
||||
<span th:if="${valid}"
|
||||
class="glyphicon glyphicon-ok form-control-feedback"
|
||||
class="fa fa-ok form-control-feedback"
|
||||
aria-hidden="true"></span>
|
||||
<th:block th:if="${!valid}">
|
||||
<span
|
||||
class="glyphicon glyphicon-remove form-control-feedback"
|
||||
class="fa fa-remove form-control-feedback"
|
||||
aria-hidden="true"></span>
|
||||
<span class="help-inline" th:errors="*{__${name}__}">Error</span>
|
||||
</th:block>
|
||||
|
|
|
|||
|
|
@ -17,60 +17,52 @@
|
|||
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
|
||||
<![endif]-->
|
||||
|
||||
<link th:href="@{/webjars/font-awesome/css/font-awesome.min.css}" rel="stylesheet">
|
||||
<link rel="stylesheet" th:href="@{/resources/css/petclinic.css}" />
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<nav class="navbar navbar-default" role="navigation">
|
||||
<div class="container">
|
||||
<div class="navbar-header">
|
||||
<a class="navbar-brand" th:href="@{/}"><span></span></a>
|
||||
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#main-navbar">
|
||||
<span class="sr-only">
|
||||
<os-p>Toggle navigation</os-p>
|
||||
</span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
<span class="icon-bar"></span>
|
||||
</button>
|
||||
</div>
|
||||
<div class="navbar-collapse collapse" id="main-navbar">
|
||||
<nav class="navbar navbar-expand-lg navbar-dark" role="navigation">
|
||||
<div class="container-fluid">
|
||||
<a class="navbar-brand" th:href="@{/}"><span></span></a>
|
||||
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#main-navbar">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<div class="collapse navbar-collapse" id="main-navbar" style>
|
||||
|
||||
<ul class="nav navbar-nav navbar-right" th:remove="all">
|
||||
<ul class="navbar-nav me-auto mb-2 mb-lg-0" th:remove="all">
|
||||
|
||||
<li th:fragment="menuItem (link,active,title,glyph,text)" class="active"
|
||||
th:class="${active==menu ? 'active' : ''}">
|
||||
<a th:href="@{__${link}__}" th:title="${title}">
|
||||
<span th:class="'glyphicon glyphicon-'+${glyph}" class="glyphicon glyphicon-home"
|
||||
aria-hidden="true"></span>
|
||||
<li th:fragment="menuItem (link,active,title,glyph,text)" th:class="nav-item">
|
||||
<a th:class="${active==menu ? 'nav-link active' : 'nav-link'}" th:href="@{__${link}__}" th:title="${title}">
|
||||
<span th:class="'fa fa-'+${glyph}" class="fa fa-home"></span>
|
||||
<span th:text="${text}">Template</span>
|
||||
</a>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
|
||||
<ul class="nav navbar-nav navbar-right">
|
||||
<ul class="nav navbar-nav me-auto">
|
||||
|
||||
<li th:replace="::menuItem ('/','home','home page','home','Home')">
|
||||
<span class="glyphicon glyphicon-home" aria-hidden="true"></span>
|
||||
<span class="fa fa-home" aria-hidden="true"></span>
|
||||
<span>Home</span>
|
||||
</li>
|
||||
|
||||
<li th:replace="::menuItem ('/owners/find','owners','find owners','search','Find owners')">
|
||||
<span class="glyphicon glyphicon-search" aria-hidden="true"></span>
|
||||
<span class="fa fa-search" aria-hidden="true"></span>
|
||||
<span>Find owners</span>
|
||||
</li>
|
||||
|
||||
<li th:replace="::menuItem ('/vets.html','vets','veterinarians','th-list','Veterinarians')">
|
||||
<span class="glyphicon glyphicon-th-list" aria-hidden="true"></span>
|
||||
<span class="fa fa-th-list" aria-hidden="true"></span>
|
||||
<span>Veterinarians</span>
|
||||
</li>
|
||||
|
||||
<li
|
||||
th:replace="::menuItem ('/oups','error','trigger a RuntimeException to see how it is handled','warning-sign','Error')">
|
||||
<span class="glyphicon glyphicon-warning-sign" aria-hidden="true"></span>
|
||||
th:replace="::menuItem ('/oups','error','trigger a RuntimeException to see how it is handled','exclamation-triangle','Error')">
|
||||
<span class="fa exclamation-triangle" aria-hidden="true"></span>
|
||||
<span>Error</span>
|
||||
</li>
|
||||
|
||||
|
|
@ -95,9 +87,9 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<script th:src="@{/webjars/jquery/jquery.min.js}"></script>
|
||||
<script th:src="@{/webjars/jquery-ui/jquery-ui.min.js}"></script>
|
||||
<script th:src="@{/webjars/bootstrap/js/bootstrap.min.js}"></script>
|
||||
<script th:src="@{/webjars/jquery/jquery.js}"></script>
|
||||
<script th:src="@{/webjars/jquery-ui/jquery-ui.js}"></script>
|
||||
<script th:src="@{/webjars/bootstrap/dist/js/bootstrap.min.js}"></script>
|
||||
|
||||
</body>
|
||||
|
||||
|
|
|
|||
|
|
@ -13,11 +13,11 @@
|
|||
th:text="${item}">dog</option>
|
||||
</select>
|
||||
<span th:if="${valid}"
|
||||
class="glyphicon glyphicon-ok form-control-feedback"
|
||||
class="fa fa-ok form-control-feedback"
|
||||
aria-hidden="true"></span>
|
||||
<th:block th:if="${!valid}">
|
||||
<span
|
||||
class="glyphicon glyphicon-remove form-control-feedback"
|
||||
class="fa fa-remove form-control-feedback"
|
||||
aria-hidden="true"></span>
|
||||
<span class="help-inline" th:errors="*{__${name}__}">Error</span>
|
||||
</th:block>
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@
|
|||
<div class="col-sm-offset-2 col-sm-10">
|
||||
<button
|
||||
th:with="text=${owner['new']} ? 'Add Owner' : 'Update Owner'"
|
||||
class="btn btn-default" type="submit" th:text="${text}">Add
|
||||
class="btn btn-primary" type="submit" th:text="${text}">Add
|
||||
Owner</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -21,15 +21,14 @@
|
|||
</div>
|
||||
<div class="form-group">
|
||||
<div class="col-sm-offset-2 col-sm-10">
|
||||
<button type="submit" class="btn btn-default">Find
|
||||
<button type="submit" class="btn btn-primary">Find
|
||||
Owner</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
<a class="btn btn-primary" th:href="@{/owners/new}">Add Owner</a>
|
||||
|
||||
<br />
|
||||
<a class="btn btn-default" th:href="@{/owners/new}">Add Owner</a>
|
||||
</form>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -28,9 +28,9 @@
|
|||
</tr>
|
||||
</table>
|
||||
|
||||
<a th:href="@{{id}/edit(id=${owner.id})}" class="btn btn-default">Edit
|
||||
<a th:href="@{{id}/edit(id=${owner.id})}" class="btn btn-primary">Edit
|
||||
Owner</a>
|
||||
<a th:href="@{{id}/pets/new(id=${owner.id})}" class="btn btn-default">Add
|
||||
<a th:href="@{{id}/pets/new(id=${owner.id})}" class="btn btn-primary">Add
|
||||
New Pet</a>
|
||||
|
||||
<br />
|
||||
|
|
|
|||
|
|
@ -38,23 +38,23 @@
|
|||
<span>] </span>
|
||||
<span>
|
||||
<a th:if="${currentPage > 1}" th:href="@{'/owners/?page=1'}" title="First"
|
||||
class="glyphicon glyphicon-backward"></a>
|
||||
<span th:unless="${currentPage > 1}" title="First" class="glyphicon glyphicon-backward"></span>
|
||||
class="fa fa-fast-backward"></a>
|
||||
<span th:unless="${currentPage > 1}" title="First" class="fa fa-fast-backward"></span>
|
||||
</span>
|
||||
<span>
|
||||
<a th:if="${currentPage > 1}" th:href="@{'/owners/?page=' + ${currentPage - 1}}" title="Previous"
|
||||
class="glyphicon glyphicon-triangle-left"></a>
|
||||
<span th:unless="${currentPage > 1}" title="Previous" class="glyphicon glyphicon-triangle-left"></span>
|
||||
class="fa fa-step-backward"></a>
|
||||
<span th:unless="${currentPage > 1}" title="Previous" class="fa fa-step-backward"></span>
|
||||
</span>
|
||||
<span>
|
||||
<a th:if="${currentPage < totalPages}" th:href="@{'/owners/?page=' + ${currentPage + 1}}" title="Next"
|
||||
class="glyphicon glyphicon-triangle-right"></a>
|
||||
<span th:unless="${currentPage < totalPages}" title="Next" class="glyphicon glyphicon-triangle-right"></span>
|
||||
class="fa fa-step-forward"></a>
|
||||
<span th:unless="${currentPage < totalPages}" title="Next" class="fa fa-step-forward"></span>
|
||||
</span>
|
||||
<span>
|
||||
<a th:if="${currentPage < totalPages}" th:href="@{'/owners/?page=' + ${totalPages}}" title="Last"
|
||||
class="glyphicon glyphicon-forward"></a>
|
||||
<span th:unless="${currentPage < totalPages}" title="Last" class="glyphicon glyphicon-forward"></span>
|
||||
class="fa fa-fast-forward"></a>
|
||||
<span th:unless="${currentPage < totalPages}" title="Last" class="fa fa-step-forward"></span>
|
||||
</span>
|
||||
</div>
|
||||
</body>
|
||||
|
|
|
|||
|
|
@ -27,7 +27,7 @@
|
|||
<div class="col-sm-offset-2 col-sm-10">
|
||||
<button
|
||||
th:with="text=${pet['new']} ? 'Add Pet' : 'Update Pet'"
|
||||
class="btn btn-default" type="submit" th:text="${text}">Add
|
||||
class="btn btn-primary" type="submit" th:text="${text}">Add
|
||||
Pet</button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -39,7 +39,7 @@
|
|||
<div class="form-group">
|
||||
<div class="col-sm-offset-2 col-sm-10">
|
||||
<input type="hidden" name="petId" th:value="${pet.id}" />
|
||||
<button class="btn btn-default" type="submit">Add Visit</button>
|
||||
<button class="btn btn-primary" type="submit">Add Visit</button>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
|
|
|||
|
|
@ -34,23 +34,23 @@
|
|||
<span>] </span>
|
||||
<span>
|
||||
<a th:if="${currentPage > 1}" th:href="@{'/vets.html/?page=1'}" title="First"
|
||||
class="glyphicon glyphicon-backward"></a>
|
||||
<span th:unless="${currentPage > 1}" title="First" class="glyphicon glyphicon-backward"></span>
|
||||
class="fa fa-fast-backward"></a>
|
||||
<span th:unless="${currentPage > 1}" title="First" class="fa fa-fast-backward"></span>
|
||||
</span>
|
||||
<span>
|
||||
<a th:if="${currentPage > 1}" th:href="@{'/vets.html/?page=' + ${currentPage - 1}}" title="Previous"
|
||||
class="glyphicon glyphicon-triangle-left"></a>
|
||||
<span th:unless="${currentPage > 1}" title="Previous" class="glyphicon glyphicon-triangle-left"></span>
|
||||
class="fa fa-step-backward"></a>
|
||||
<span th:unless="${currentPage > 1}" title="Previous" class="fa fa-step-backward"></span>
|
||||
</span>
|
||||
<span>
|
||||
<a th:if="${currentPage < totalPages}" th:href="@{'/vets.html/?page=' + ${currentPage + 1}}" title="Next"
|
||||
class="glyphicon glyphicon-triangle-right"></a>
|
||||
<span th:unless="${currentPage < totalPages}" title="Next" class="glyphicon glyphicon-triangle-right"></span>
|
||||
class="fa fa-step-forward"></a>
|
||||
<span th:unless="${currentPage < totalPages}" title="Next" class="fa fa-step-forward"></span>
|
||||
</span>
|
||||
<span>
|
||||
<a th:if="${currentPage < totalPages}" th:href="@{'/vets.html/?page=' + ${totalPages}}" title="Last"
|
||||
class="glyphicon glyphicon-forward"></a>
|
||||
<span th:unless="${currentPage < totalPages}" title="Last" class="glyphicon glyphicon-forward"></span>
|
||||
class="fa fa-fast-forward"></a>
|
||||
<span th:unless="${currentPage < totalPages}" title="Last" class="fa fa-fast-forward"></span>
|
||||
</span>
|
||||
</div>
|
||||
</body>
|
||||
|
|
|
|||
211
src/main/scss/petclinic.scss
Normal file
211
src/main/scss/petclinic.scss
Normal file
|
|
@ -0,0 +1,211 @@
|
|||
/*
|
||||
* Copyright 2016 the original author or authors.
|
||||
*
|
||||
* You may obtain a copy of the License at
|
||||
*
|
||||
* https://www.apache.org/licenses/LICENSE-2.0
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
@import "../../../node_modules/bootstrap/scss/bootstrap";
|
||||
|
||||
$icon-font-path: "../../webjars/bootstrap/fonts/";
|
||||
|
||||
$spring-green: #6db33f;
|
||||
$spring-dark-green: #5fa134;
|
||||
$spring-brown: #34302D;
|
||||
$spring-grey: #838789;
|
||||
$spring-light-grey: #f1f1f1;
|
||||
|
||||
$body-bg: $spring-light-grey;
|
||||
$text-color: $spring-brown;
|
||||
$link-color: $spring-dark-green;
|
||||
$link-hover-color: $spring-dark-green;
|
||||
|
||||
$navbar-default-link-color: $spring-light-grey;
|
||||
$navbar-default-link-active-color: $spring-light-grey;
|
||||
$navbar-default-link-hover-color: $spring-light-grey;
|
||||
$navbar-default-link-hover-bg: $spring-green;
|
||||
$navbar-default-toggle-icon-bar-bg: $spring-light-grey;
|
||||
$navbar-default-toggle-hover-bg: transparent;
|
||||
$navbar-default-link-active-bg: $spring-green;
|
||||
|
||||
$border-radius-base: 0;
|
||||
$border-radius-large: 0;
|
||||
$border-radius-small: 0;
|
||||
|
||||
$btn-primary-color: $spring-light-grey;
|
||||
$btn-primary-bg: $spring-brown;
|
||||
$btn-primary-border: $spring-green;
|
||||
|
||||
$nav-tabs-active-link-hover-color: $spring-light-grey;
|
||||
$nav-tabs-active-link-hover-bg: $spring-brown;
|
||||
$nav-tabs-active-link-hover-border-color: $spring-brown;
|
||||
$nav-tabs-border-color: $spring-brown;
|
||||
|
||||
$pagination-active-bg: $spring-brown;
|
||||
$pagination-active-border: $spring-green;
|
||||
$table-border-color: $spring-brown;
|
||||
|
||||
.table > thead > tr > th {
|
||||
background-color: lighten($spring-brown, 3%);
|
||||
color: $spring-light-grey;
|
||||
}
|
||||
|
||||
.table-filter {
|
||||
background-color: $spring-brown;
|
||||
padding: 9px 12px;
|
||||
}
|
||||
|
||||
.nav > li > a {
|
||||
color: $spring-grey;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
margin-top: 12px;
|
||||
border-width: 2px;
|
||||
transition: border 0.15s;
|
||||
-webkit-transition: border 0.15s;
|
||||
-moz-transition: border 0.15s;
|
||||
-o-transition: border 0.15s;
|
||||
-ms-transition: border 0.15s;
|
||||
|
||||
&:hover,
|
||||
&:focus,
|
||||
&:active,
|
||||
&.active,
|
||||
.open .dropdown-toggle {
|
||||
background-color: $spring-brown;
|
||||
border-color: $spring-brown;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.container .text-muted {
|
||||
margin: 20px 0;
|
||||
}
|
||||
|
||||
code {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
.xd-container {
|
||||
margin-top: 40px;
|
||||
margin-bottom: 100px;
|
||||
padding-left: 5px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin-bottom: 15px
|
||||
}
|
||||
|
||||
.index-page--subtitle {
|
||||
font-size: 16px;
|
||||
line-height: 24px;
|
||||
margin: 0 0 30px;
|
||||
}
|
||||
|
||||
.form-horizontal button.btn-inverse {
|
||||
margin-left: 32px;
|
||||
}
|
||||
|
||||
#job-params-modal .modal-dialog {
|
||||
width: 90%;
|
||||
margin-left:auto;
|
||||
margin-right:auto;
|
||||
}
|
||||
|
||||
[ng-cloak].splash {
|
||||
display: block !important;
|
||||
}
|
||||
[ng-cloak] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.splash {
|
||||
background: $spring-green;
|
||||
color: $spring-brown;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.error-page {
|
||||
margin-top: 100px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.error-page .error-title {
|
||||
font-size: 24px;
|
||||
line-height: 24px;
|
||||
margin: 30px 0 0;
|
||||
}
|
||||
|
||||
table td {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
table td .progress {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
table td.action-column {
|
||||
width: 1px;
|
||||
}
|
||||
|
||||
.help-block {
|
||||
color: lighten($text-color, 50%); // lighten the text some for contrast
|
||||
}
|
||||
|
||||
.xd-containers {
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
.cluster-view > table td {
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.cluster-view .label, .cluster-view .column-block {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.cluster-view .input-group-addon {
|
||||
width: 0%;
|
||||
}
|
||||
|
||||
.cluster-view {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.container-details-table th {
|
||||
background-color: lighten($spring-brown, 3%);
|
||||
color: $spring-light-grey;
|
||||
}
|
||||
|
||||
.status-help-content-table td {
|
||||
color: $spring-brown;
|
||||
}
|
||||
|
||||
.myspinner {
|
||||
animation-name: spinner;
|
||||
animation-duration: 2s;
|
||||
animation-iteration-count: infinite;
|
||||
animation-timing-function: linear;
|
||||
|
||||
-webkit-transform-origin: 49% 50%;
|
||||
-webkit-animation-name: spinner;
|
||||
-webkit-animation-duration: 2s;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-webkit-animation-timing-function: linear;
|
||||
}
|
||||
|
||||
hr {
|
||||
border-top: 1px dotted $spring-brown;
|
||||
}
|
||||
|
||||
@import "typography.scss";
|
||||
@import "header.scss";
|
||||
@import "responsive.scss";
|
||||
|
|
@ -3,7 +3,7 @@
|
|||
position:absolute;
|
||||
z-index: 9999;
|
||||
left:0px;
|
||||
top:0px;
|
||||
top:0px;
|
||||
}
|
||||
|
||||
.navbar a.navbar-brand {
|
||||
|
|
@ -1,4 +0,0 @@
|
|||
#List of preProcessors
|
||||
preProcessors=lessCssImport
|
||||
#List of postProcessors
|
||||
postProcessors=less4j
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
<groups xmlns="http://www.isdc.ro/wro">
|
||||
<group name="petclinic">
|
||||
<css>classpath:META-INF/resources/webjars/bootstrap/3.3.6/less/bootstrap.less</css>
|
||||
<css>/petclinic.less</css>
|
||||
</group>
|
||||
</groups>
|
||||
Loading…
Reference in a new issue