mirror of
https://github.com/tuna/mirror-web.git
synced 2025-12-25 20:32:46 +00:00
remove sass
This commit is contained in:
parent
067b26ff36
commit
6dc025710e
183
sass/_lib.scss
183
sass/_lib.scss
|
|
@ -1,183 +0,0 @@
|
|||
|
||||
@mixin border-radius($tl: 5px, $tr: 5px, $br: 5px, $bl: 5px) {
|
||||
border-radius:$tl $tr $br $bl;
|
||||
-webkit-border-radius:$tl $tr $br $bl;
|
||||
-moz-border-radius:$tl $tr $br $bl;
|
||||
-o-border-radius:$tl $tr $br $bl;
|
||||
-ms-border-radius:$tl $tr $br $bl;
|
||||
}
|
||||
|
||||
|
||||
@mixin keyframes($name) {
|
||||
@-webkit-keyframes #{$name} {
|
||||
@content;
|
||||
}
|
||||
@-moz-keyframes #{$name} {
|
||||
@content;
|
||||
}
|
||||
@-ms-keyframes #{$name} {
|
||||
@content;
|
||||
}
|
||||
@-o-keyframes #{$name} {
|
||||
@content;
|
||||
}
|
||||
@keyframes #{$name} {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin columns($count, $gap: 0) {
|
||||
-webkit-column-count: $count;
|
||||
-moz-column-count: $count;
|
||||
-ms-column-count: $count;
|
||||
-o-column-count: $count;
|
||||
column-count: $count;
|
||||
-webkit-column-gap: $gap;
|
||||
-moz-column-gap: $gap;
|
||||
-ms-column-gap: $gap;
|
||||
-o-column-gap: $gap;
|
||||
column-gap: $gap;
|
||||
}
|
||||
|
||||
@mixin transition($transition-property: all, $transition-time: 200ms, $method: ease-in-out) {
|
||||
-webkit-transition: $transition-property $transition-time $method;
|
||||
-moz-transition: $transition-property $transition-time $method;
|
||||
-ms-transition: $transition-property $transition-time $method;
|
||||
-o-transition: $transition-property $transition-time $method;
|
||||
transition: $transition-property $transition-time $method;
|
||||
}
|
||||
|
||||
@mixin animation-name($name) {
|
||||
-webkit-animation-name: $name;
|
||||
-moz-animation-name: $name;
|
||||
-ms-animation-name: $name;
|
||||
animation-name: $name;
|
||||
}
|
||||
|
||||
@mixin animation-duration($name) {
|
||||
-webkit-animation-duration: $name;
|
||||
-moz-animation-duration: $name;
|
||||
-ms-animation-duration: $name;
|
||||
animation-duration: $name;
|
||||
}
|
||||
|
||||
@mixin animation-timing-function($name) {
|
||||
-webkit-animation-timing-function: $name;
|
||||
-moz-animation-timing-function: $name;
|
||||
-ms-animation-timing-function: $name;
|
||||
animation-timing-function: $name;
|
||||
}
|
||||
|
||||
@mixin animation-iteration-count($name) {
|
||||
-webkit-animation-iteration-count: $name;
|
||||
-moz-animation-iteration-count: $name;
|
||||
-ms-animation-iteration-count: $name;
|
||||
animation-iteration-count: $name;
|
||||
}
|
||||
|
||||
@mixin animation-direction($name) {
|
||||
-webkit-animation-direction: $name;
|
||||
-moz-animation-direction: $name;
|
||||
-ms-animation-direction: $name;
|
||||
animation-direction: $name;
|
||||
}
|
||||
|
||||
@mixin animation-delay($name) {
|
||||
-webkit-animation-delay: $name;
|
||||
-moz-animation-delay: $name;
|
||||
-ms-animation-delay: $name;
|
||||
animation-delay: $name;
|
||||
}
|
||||
|
||||
@mixin animation-play-state($name) {
|
||||
-webkit-animation-play-state: $name;
|
||||
-moz-animation-play-state: $name;
|
||||
-ms-animation-play-state: $name;
|
||||
animation-play-state: $name;
|
||||
}
|
||||
|
||||
@mixin animation-fill-mode($name) {
|
||||
-webkit-animation-fill-mode: $name;
|
||||
-moz-animation-fill-mode: $name;
|
||||
-ms-animation-fill-mode: $name;
|
||||
animation-fill-mode: $name;
|
||||
}
|
||||
|
||||
|
||||
@mixin gradient-vertical($startColor: #555, $endColor: #333) {
|
||||
background-color: mix($startColor, $endColor, 60%);
|
||||
background-image: -moz-linear-gradient(top, $startColor, $endColor); // FF 3.6+
|
||||
background-image: -webkit-gradient(linear, 0 0, 0 100%, from($startColor), to($endColor)); // Safari 4+, Chrome 2+
|
||||
background-image: -webkit-linear-gradient(top, $startColor, $endColor); // Safari 5.1+, Chrome 10+
|
||||
background-image: -o-linear-gradient(top, $startColor, $endColor); // Opera 11.10
|
||||
background-image: linear-gradient(to bottom, $startColor, $endColor); // Standard, IE10
|
||||
background-repeat: repeat-x;
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=ie-hex-str($startColor), endColorstr=ie-hex-str($endColor),GradientType=0 ); /* IE6-9 */
|
||||
}
|
||||
|
||||
@mixin gradient-radial($innerColor: #555, $outerColor: #333) {
|
||||
background-color: $outerColor;
|
||||
background-image: -webkit-gradient(radial, center center, 0, center center, 460, from($innerColor), to($outerColor));
|
||||
background-image: -webkit-radial-gradient(circle, $innerColor, $outerColor);
|
||||
background-image: -moz-radial-gradient(circle, $innerColor, $outerColor);
|
||||
background-image: -o-radial-gradient(circle, $innerColor, $outerColor);
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
@mixin box-shadow($shadow){
|
||||
-webkit-box-shadow: $shadow;
|
||||
-moz-box-shadow: $shadow;
|
||||
box-shadow: $shadow;
|
||||
}
|
||||
|
||||
@mixin display-flex() {
|
||||
display: flex;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flex;
|
||||
display: -moz-flex-box;
|
||||
}
|
||||
|
||||
@mixin flex-flow($flow: row) {
|
||||
flex-flow: $flow;
|
||||
-webkit-flex-flow: $flow;
|
||||
-ms-flex-flow: $flow;
|
||||
-moz-flex-flow: $flow;
|
||||
}
|
||||
|
||||
@mixin flex-order($order: 1) {
|
||||
flex-order: $order;
|
||||
-webkit-flex-order: $order;
|
||||
-ms-flex-order: $order;
|
||||
-moz-flex-order: $order;
|
||||
order: $order;
|
||||
-webkit-order: $order;
|
||||
-ms-order: $order;
|
||||
-moz-order: $order;
|
||||
}
|
||||
|
||||
@mixin flex-wrap($wrap) {
|
||||
flex-wrap: $wrap;
|
||||
-webkit-flex-wrap: $wrap;
|
||||
-ms-flex-wrap: $wrap;
|
||||
-moz-flex-wrap: $wrap;
|
||||
}
|
||||
|
||||
@mixin flex-align($align) {
|
||||
flex-align: $align;
|
||||
-webkit-flex-align: $align;
|
||||
-ms-flex-align: $align;
|
||||
-moz-flex-align: $align;
|
||||
}
|
||||
@mixin flex-pack($pack) {
|
||||
flex-pack: $pack;
|
||||
-webkit-flex-pack: $pack;
|
||||
-ms-flex-pack: $pack;
|
||||
-moz-flex-pack: $pack;
|
||||
}
|
||||
|
||||
@mixin flex($flex) {
|
||||
flex: $flex;
|
||||
-webkit-flex: $flex;
|
||||
-ms-flex: $flex;
|
||||
-moz-flex: $flex;
|
||||
}
|
||||
202
sass/tuna.scss
202
sass/tuna.scss
|
|
@ -1,202 +0,0 @@
|
|||
$dark-grey: #222;
|
||||
$light-grey: #777;
|
||||
$grey: #333;
|
||||
$tunablue: #2c7edf;
|
||||
$light-blue: #7cb2d7;
|
||||
$linkColor: #08C;
|
||||
$thucolor: #71337F;
|
||||
$contentBgColor: #efefef;
|
||||
|
||||
$navWidth: 120px;
|
||||
$footerHeight: 22px;
|
||||
$headerHeight: 60px;
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: url('fonts/Regular/OpenSans-Regular.eot');
|
||||
src: url('fonts/Regular/OpenSans-Regular.eot?#iefix') format('embedded-opentype'),
|
||||
url('fonts/Regular/OpenSans-Regular.woff') format('woff'),
|
||||
url('fonts/Regular/OpenSans-Regular.ttf') format('truetype'),
|
||||
url('fonts/Regular/OpenSans-Regular.svg#OpenSansLight') format('svg');
|
||||
font-weight: 300;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'Open Sans';
|
||||
src: url('fonts/Semibold/OpenSans-Semibold.eot');
|
||||
src: url('fonts/Semibold/OpenSans-Semibold.eot?#iefix') format('embedded-opentype'),
|
||||
url('fonts/Semibold/OpenSans-Semibold.woff') format('woff'),
|
||||
url('fonts/Semibold/OpenSans-Semibold.ttf') format('truetype'),
|
||||
url('fonts/Semibold/OpenSans-Semibold.svg#OpenSansSemibold') format('svg');
|
||||
font-weight: 600;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
body {
|
||||
font-size: 16px;
|
||||
color: #444;
|
||||
}
|
||||
a, a:visited {
|
||||
color: $tunablue;
|
||||
text-decoration: none;
|
||||
}
|
||||
a:hover {
|
||||
color: $light-blue;
|
||||
}
|
||||
|
||||
h1,h2,h3,h4 {
|
||||
color: $thucolor;
|
||||
}
|
||||
|
||||
.aside {
|
||||
border: 1px solid $light-grey;
|
||||
background-color: darken(#FFF, 10%);
|
||||
}
|
||||
|
||||
.placeholder {
|
||||
height: 1em;
|
||||
width: 100%;
|
||||
display: none;
|
||||
@media screen and (min-width: 1130px) {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.padding-1-lr {
|
||||
@media screen and (min-width: 1130px) {
|
||||
padding-left: 1em;
|
||||
padding-right: 1em;
|
||||
}
|
||||
@media screen and (max-width: 1129px) {
|
||||
padding-left: 1%;
|
||||
padding-right: 1%;
|
||||
}
|
||||
}
|
||||
|
||||
.padding-2-lr {
|
||||
@media screen and (min-width: 1130px) {
|
||||
padding-left: 2em;
|
||||
padding-right: 2em;
|
||||
}
|
||||
@media screen and (max-width: 1129px) {
|
||||
padding-left: 2%;
|
||||
padding-right: 2%;
|
||||
}
|
||||
}
|
||||
|
||||
.pull-right {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.pull-left {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.nospam {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.pure-g-r [class *="pure-u"] {
|
||||
font-family: "Open Sans", "Ubuntu", "Hiragino Sans GB", "WenQuanYi Micro Hei", "WenQuanYi Zen Hei", "STHeiti", "微软雅黑", sans-serif;
|
||||
}
|
||||
|
||||
#wrapper {
|
||||
background-color: #FFFFFF;
|
||||
@media screen and (min-width: 1130px) {
|
||||
margin: 0 5% 0 5%;
|
||||
width: auto;
|
||||
}
|
||||
@media screen and (max-width: 1129px) {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
#header {
|
||||
margin-bottom: 1em;
|
||||
//border-bottom: 1px solid $thucolor;
|
||||
background-color: $thucolor;
|
||||
h1 {
|
||||
color: white;
|
||||
font-weight: normal;
|
||||
}
|
||||
.tagline {
|
||||
margin-bottom: 1.2em;
|
||||
color: lighten($thucolor, 50%);
|
||||
}
|
||||
|
||||
.pure-menu {
|
||||
background-color: transparent;
|
||||
li {
|
||||
&.pure-menu-selected, &.pure-menu-selected:hover {
|
||||
a, a:hover {
|
||||
font-weight: bold;
|
||||
color: $thucolor;
|
||||
}
|
||||
background-color: white;
|
||||
}
|
||||
a {
|
||||
&:hover {
|
||||
background-color: transparent !important;
|
||||
color: $thucolor;
|
||||
}
|
||||
color: white;
|
||||
}
|
||||
&:hover {
|
||||
background-color: white;
|
||||
}
|
||||
background-color: $thucolor;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
#mirrorlist {
|
||||
width: 100%;
|
||||
border-spacing: 0;
|
||||
thead, tbody, tr {
|
||||
width: 100%;
|
||||
}
|
||||
th {
|
||||
color: $thucolor;
|
||||
}
|
||||
th, td {
|
||||
text-align: left;
|
||||
padding: 4px 0;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
thead > tr {
|
||||
border-bottom: 1px solid #DDD;
|
||||
}
|
||||
tbody > tr:nth-child(even) {
|
||||
background-color: lighten($thucolor, 60%);
|
||||
}
|
||||
|
||||
.distribution {
|
||||
width: 20%;
|
||||
@media screen and (max-width: 768px) {
|
||||
width: 60%;
|
||||
}
|
||||
}
|
||||
.description {
|
||||
width: 40%;
|
||||
@media screen and (max-width: 768px) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.update {
|
||||
width: 20%;
|
||||
@media screen and (max-width: 768px) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
.help {
|
||||
width: 20%;
|
||||
@media screen and (max-width: 768px) {
|
||||
width: 40%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Loading…
Reference in New Issue