mirror of
https://github.com/IvarK/AntimatterDimensionsSourceCode.git
synced 2024-11-25 05:32:17 +00:00
Inline SFC CSS classes into a separate CSS file to prevent conflicts with styles.css
This commit is contained in:
parent
4e88cb07dd
commit
1c1e8fbdc5
@ -14,6 +14,7 @@
|
||||
<link rel="stylesheet" type="text/css" href="stylesheets/codemirror/lint.css">
|
||||
<link rel="stylesheet" type="text/css" href="stylesheets/codemirror/panda-syntax.css">
|
||||
<link rel="stylesheet" type="text/css" href="stylesheets/codemirror/liquibyte.css">
|
||||
<link rel="stylesheet" type="text/css" href="stylesheets/vue-sfc-classes.css">
|
||||
<link rel="stylesheet" type="text/css" href="stylesheets/components.css">
|
||||
<link rel="stylesheet" type="text/css" href="stylesheets/ad-slider-component.css">
|
||||
<link rel="stylesheet" type="text/css" href="stylesheets/glyphs.css">
|
||||
|
108
public/stylesheets/vue-sfc-classes.css
Normal file
108
public/stylesheets/vue-sfc-classes.css
Normal file
@ -0,0 +1,108 @@
|
||||
/* Temporary inlined css classes from SFCs to prevent conflicts with old classes from styles.css */
|
||||
|
||||
/* FooterLinks.vue */
|
||||
|
||||
.o-footer {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
text-align: center;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
/* HintText.vue */
|
||||
|
||||
.o-hint-text {
|
||||
font-size: 1.55rem;
|
||||
color: white;
|
||||
text-shadow:
|
||||
-0.1rem -0.1rem 0 black,
|
||||
-0.1rem -0.1rem 0 black,
|
||||
0.1rem -0.1rem 0 black,
|
||||
0.1rem -0.1rem 0 black,
|
||||
-0.1rem 0.1rem 0 black,
|
||||
-0.1rem 0.1rem 0 black,
|
||||
0.1rem 0.1rem 0 black,
|
||||
0.1rem 0.1rem 0 black;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.l-hint-text {
|
||||
position: absolute;
|
||||
top: -1.6rem;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
/* NewsTicker.vue */
|
||||
|
||||
.c-news-ticker {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.c-news-ticker__line {
|
||||
padding-left: 100%;
|
||||
transition: transform linear;
|
||||
}
|
||||
|
||||
.c-disable-ticker-animation > * {
|
||||
animation-play-state: paused !important;
|
||||
}
|
||||
|
||||
.c-news-line {
|
||||
display: inline-block;
|
||||
font-family: Typewriter, serif;
|
||||
font-size: 1.5rem;
|
||||
white-space: nowrap;
|
||||
font-weight: bold;
|
||||
text-align: left;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.c-news-line a {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.new-ui .c-news-ticker {
|
||||
width: 100%;
|
||||
border-bottom: 0.1rem solid var(--color-accent);
|
||||
padding: 0.8rem 0;
|
||||
height: 3.9rem;
|
||||
}
|
||||
|
||||
.new-ui .c-news-line {
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
||||
.old-ui .c-news-ticker {
|
||||
border: 0.2rem solid black;
|
||||
border-radius: 0.4rem;
|
||||
padding: 0.2rem 0;
|
||||
height: 3rem;
|
||||
}
|
||||
|
||||
.old-ui .s-base--metro .c-news-ticker,
|
||||
.old-ui .t-s6 .c-news-ticker,
|
||||
.old-ui .t-s10 .c-news-ticker {
|
||||
border-width: 0.1rem;
|
||||
}
|
||||
|
||||
.old-ui .t-dark .c-news-ticker {
|
||||
border-color: #546e7a;
|
||||
background-color: #455a64;
|
||||
}
|
||||
|
||||
.old-ui .t-dark-metro .c-news-ticker {
|
||||
background-color: #455a64;
|
||||
}
|
||||
|
||||
.old-ui .t-s1 .c-news-ticker {
|
||||
background-color: #dbd242
|
||||
}
|
||||
|
||||
.old-ui .t-s6 .c-news-ticker,
|
||||
.old-ui .t-s10 .c-news-ticker {
|
||||
background-color: black;
|
||||
}
|
||||
|
||||
.old-ui .c-news-line {
|
||||
color: var(--color-text);
|
||||
}
|
@ -42,12 +42,3 @@ export default {
|
||||
</FooterLink>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.o-footer {
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
text-align: center;
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
</style>
|
||||
|
@ -24,26 +24,3 @@ export default {
|
||||
<slot />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.o-hint-text {
|
||||
font-size: 1.55rem;
|
||||
color: white;
|
||||
text-shadow:
|
||||
-0.1rem -0.1rem 0 black,
|
||||
-0.1rem -0.1rem 0 black,
|
||||
0.1rem -0.1rem 0 black,
|
||||
0.1rem -0.1rem 0 black,
|
||||
-0.1rem 0.1rem 0 black,
|
||||
-0.1rem 0.1rem 0 black,
|
||||
0.1rem 0.1rem 0 black,
|
||||
0.1rem 0.1rem 0 black;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.l-hint-text {
|
||||
position: absolute;
|
||||
top: -1.6rem;
|
||||
left: 0;
|
||||
}
|
||||
</style>
|
||||
|
@ -129,78 +129,3 @@ export default {
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.c-news-ticker {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.c-news-ticker__line {
|
||||
padding-left: 100%;
|
||||
transition: transform linear;
|
||||
}
|
||||
|
||||
.c-disable-ticker-animation > * {
|
||||
animation-play-state: paused !important;
|
||||
}
|
||||
|
||||
.c-news-line {
|
||||
display: inline-block;
|
||||
font-family: Typewriter, serif;
|
||||
font-size: 1.5rem;
|
||||
white-space: nowrap;
|
||||
font-weight: bold;
|
||||
text-align: left;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.c-news-line a {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.new-ui .c-news-ticker {
|
||||
width: 100%;
|
||||
border-bottom: 0.1rem solid var(--color-accent);
|
||||
padding: 0.8rem 0;
|
||||
height: 3.9rem;
|
||||
}
|
||||
|
||||
.new-ui .c-news-line {
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
||||
.old-ui .c-news-ticker {
|
||||
border: 0.2rem solid black;
|
||||
border-radius: 0.4rem;
|
||||
padding: 0.2rem 0;
|
||||
height: 3rem;
|
||||
}
|
||||
|
||||
.old-ui .s-base--metro .c-news-ticker,
|
||||
.old-ui .t-s6 .c-news-ticker,
|
||||
.old-ui .t-s10 .c-news-ticker {
|
||||
border-width: 0.1rem;
|
||||
}
|
||||
|
||||
.old-ui .t-dark .c-news-ticker {
|
||||
border-color: #546e7a;
|
||||
background-color: #455a64;
|
||||
}
|
||||
|
||||
.old-ui .t-dark-metro .c-news-ticker {
|
||||
background-color: #455a64;
|
||||
}
|
||||
|
||||
.old-ui .t-s1 .c-news-ticker {
|
||||
background-color: #dbd242
|
||||
}
|
||||
|
||||
.old-ui .t-s6 .c-news-ticker,
|
||||
.old-ui .t-s10 .c-news-ticker {
|
||||
background-color: black;
|
||||
}
|
||||
|
||||
.old-ui .c-news-line {
|
||||
color: var(--color-text);
|
||||
}
|
||||
</style>
|
||||
|
Loading…
Reference in New Issue
Block a user