Compare commits
No commits in common. "b96c16918b9bf0c58711044eed7df4a03196d086" and "5710f10999bb0b7dd79a743c952eb4557396de8b" have entirely different histories.
b96c16918b
...
5710f10999
|
@ -1,8 +1,7 @@
|
||||||
<html>
|
<html>
|
||||||
<head>
|
<head>
|
||||||
<script src="static/js/elm.js"></script>
|
<script src="/static/js/elm.js"></script>
|
||||||
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
|
<link rel="stylesheet" href="/static/css/style.css">
|
||||||
<link rel="stylesheet" href="static/css/style.css">
|
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="elm"></div>
|
<div id="elm"></div>
|
||||||
|
|
|
@ -16,7 +16,7 @@ updateChangeRawModel l f m =
|
||||||
updateCreateRawModel : Model -> (Model, Cmd Msg)
|
updateCreateRawModel : Model -> (Model, Cmd Msg)
|
||||||
updateCreateRawModel m =
|
updateCreateRawModel m =
|
||||||
let
|
let
|
||||||
freshRawModel = { blockSize = "4", setCount = "4", setSize = "3" }
|
freshRawModel = { blockSize = "", setCount = "", setSize = "" }
|
||||||
newModel = { m | rawHierarchy = m.rawHierarchy ++ [ freshRawModel ] }
|
newModel = { m | rawHierarchy = m.rawHierarchy ++ [ freshRawModel ] }
|
||||||
cmd = Cmd.none
|
cmd = Cmd.none
|
||||||
in
|
in
|
||||||
|
|
|
@ -4,67 +4,29 @@ import CacheSim.Model exposing (..)
|
||||||
import CacheSim.Cache exposing (..)
|
import CacheSim.Cache exposing (..)
|
||||||
import CacheSim.AccessView exposing (..)
|
import CacheSim.AccessView exposing (..)
|
||||||
import CacheSim.Hierarchy exposing (..)
|
import CacheSim.Hierarchy exposing (..)
|
||||||
import Html exposing (Html, Attribute, input, text, div, label, span, h2, h3, table, tr, td, th, p, h1)
|
import Html exposing (Html, input, text, div, label, span, h2, h3, table, tr, td)
|
||||||
import Html.Attributes exposing (type_, class, value, for, classList, disabled, colspan, hidden)
|
import Html.Attributes exposing (type_, class, value, for, classList, disabled, colspan)
|
||||||
import Html.Events exposing (onInput, onClick)
|
import Html.Events exposing (onInput, onClick)
|
||||||
|
|
||||||
-- Button components, powered by Bootstrap
|
optionalButton : Bool -> String -> Msg -> Html Msg
|
||||||
basicButton : List (Attribute Msg) -> String -> Html Msg
|
optionalButton e s m =
|
||||||
basicButton attrs s = input ([ type_ "button", value s, class "btn", class "btn-info" ] ++ attrs) []
|
let
|
||||||
|
events = if e then [ onClick m ] else [ disabled (not e) ]
|
||||||
disabledButton : String -> Html Msg
|
in
|
||||||
disabledButton = basicButton [ disabled True ]
|
input ([ type_ "button", value s ] ++ events) []
|
||||||
|
|
||||||
advancedButton : List (Attribute Msg) -> String -> Msg -> Html Msg
|
|
||||||
advancedButton attrs s m = basicButton (attrs ++ [ onClick m ]) s
|
|
||||||
|
|
||||||
button : String -> Msg -> Html Msg
|
button : String -> Msg -> Html Msg
|
||||||
button s m = basicButton [ onClick m ] s
|
button s m = input [ type_ "button", onClick m, value s] []
|
||||||
|
|
||||||
dangerButton : String -> Msg -> Html Msg
|
|
||||||
dangerButton = advancedButton [ class "btn-danger" ]
|
|
||||||
|
|
||||||
primaryButton : String -> Msg -> Html Msg
|
|
||||||
primaryButton = advancedButton [ class "btn-primary" ]
|
|
||||||
|
|
||||||
secondaryButton : String -> Msg -> Html Msg
|
|
||||||
secondaryButton = advancedButton [ class "btn-secondary" ]
|
|
||||||
|
|
||||||
maybeButton : Maybe a -> String -> (a -> Msg) -> Html Msg
|
|
||||||
maybeButton m s f =
|
|
||||||
case m of
|
|
||||||
Just v -> button s (f v)
|
|
||||||
_ -> disabledButton s
|
|
||||||
|
|
||||||
resultButton : Result e a -> String -> (a -> Msg) -> Html Msg
|
|
||||||
resultButton = maybeButton << Result.toMaybe
|
|
||||||
|
|
||||||
-- Button wrapper (button group)
|
|
||||||
buttonWrapper : List (Html Msg) -> Html Msg
|
buttonWrapper : List (Html Msg) -> Html Msg
|
||||||
buttonWrapper = div [ classList [("btn-group", True), ("mb-3", True) ] ]
|
buttonWrapper = div [ class "button-wrapper" ]
|
||||||
|
|
||||||
-- Input with a label
|
|
||||||
labeledInput : String -> String -> (String -> Msg) -> Html Msg
|
labeledInput : String -> String -> (String -> Msg) -> Html Msg
|
||||||
labeledInput s val f =
|
labeledInput s val f =
|
||||||
div [ class "input-group mb-3" ]
|
div [ class "input-group" ]
|
||||||
[ div [ class "input-group-prepend" ]
|
[ span [] [ text s ]
|
||||||
[ span [ class "input-group-text" ] [ text s ]
|
, input [ value val, type_ "text", onInput f ] []
|
||||||
]
|
]
|
||||||
, input [ value val, type_ "text", class "form-control", onInput f ] []
|
|
||||||
]
|
|
||||||
|
|
||||||
-- Error view
|
|
||||||
viewError : Bool -> String -> Html Msg
|
|
||||||
viewError hide e = div
|
|
||||||
[ classList
|
|
||||||
[ ("alert", True)
|
|
||||||
, ("alert-danger", True)
|
|
||||||
]
|
|
||||||
, hidden hide
|
|
||||||
] [ text e ]
|
|
||||||
|
|
||||||
panel : List (Html Msg) -> Html Msg
|
|
||||||
panel = div [ classList [("card", True), ("p-3", True), ("mb-3", True) ] ]
|
|
||||||
|
|
||||||
viewRawCacheModel : Int -> RawCacheModel -> Html Msg
|
viewRawCacheModel : Int -> RawCacheModel -> Html Msg
|
||||||
viewRawCacheModel level rcm =
|
viewRawCacheModel level rcm =
|
||||||
|
@ -74,15 +36,15 @@ viewRawCacheModel level rcm =
|
||||||
updateSetSize s cm = { cm | setSize = s}
|
updateSetSize s cm = { cm | setSize = s}
|
||||||
wrapUpdate f s = ChangeRawModel level (f s)
|
wrapUpdate f s = ChangeRawModel level (f s)
|
||||||
|
|
||||||
deleteButton = dangerButton "Delete" (DeleteRawModel level)
|
deleteButton = button "Delete" (DeleteRawModel level)
|
||||||
|
|
||||||
params = div []
|
params = div [ class "cache-model-params" ]
|
||||||
[ labeledInput "Block size" rcm.blockSize (wrapUpdate updateBlockSize)
|
[ labeledInput "Block size" rcm.blockSize (wrapUpdate updateBlockSize)
|
||||||
, labeledInput "Set count" rcm.setCount (wrapUpdate updateSetCount)
|
, labeledInput "Set count" rcm.setCount (wrapUpdate updateSetCount)
|
||||||
, labeledInput "Set size" rcm.setSize (wrapUpdate updateSetSize)
|
, labeledInput "Set size" rcm.setSize (wrapUpdate updateSetSize)
|
||||||
]
|
]
|
||||||
in
|
in
|
||||||
panel
|
div [ class "cache-model" ]
|
||||||
[ h3 [] [ text <| "L" ++ String.fromInt (level + 1) ++ " Cache" ]
|
[ h3 [] [ text <| "L" ++ String.fromInt (level + 1) ++ " Cache" ]
|
||||||
, buttonWrapper [ deleteButton ]
|
, buttonWrapper [ deleteButton ]
|
||||||
, params
|
, params
|
||||||
|
@ -95,15 +57,21 @@ viewRawCacheModelHierarchy rcmh =
|
||||||
<| List.indexedMap viewRawCacheModel rcmh
|
<| List.indexedMap viewRawCacheModel rcmh
|
||||||
translationResult = Result.andThen validateCacheModelHierarchy
|
translationResult = Result.andThen validateCacheModelHierarchy
|
||||||
<| translateRawCacheModelHierarchy rcmh
|
<| translateRawCacheModelHierarchy rcmh
|
||||||
|
isValid =
|
||||||
|
case translationResult of
|
||||||
|
Ok _ -> True
|
||||||
|
Err _ -> False
|
||||||
errorHtml =
|
errorHtml =
|
||||||
case translationResult of
|
case translationResult of
|
||||||
Ok _ -> viewError True ""
|
Ok _ -> viewError True ""
|
||||||
Err e -> viewError False e
|
Err e -> viewError False e
|
||||||
|
|
||||||
newButton = button "Add level" CreateRawModel
|
newButton = button "Add level" CreateRawModel
|
||||||
useButton = resultButton translationResult "Use hierarchy" (UseHierarchy << Just)
|
useButton = case translationResult of
|
||||||
|
Ok cmh -> optionalButton True "Use hierarchy" (UseHierarchy <| Just cmh)
|
||||||
|
Err _ -> optionalButton False "Use hierarchy" (UseHierarchy Nothing)
|
||||||
in
|
in
|
||||||
div []
|
div [ class "cache-model-hierarchy" ]
|
||||||
[ h2 [] [ text "Cache hierarchy" ]
|
[ h2 [] [ text "Cache hierarchy" ]
|
||||||
, errorHtml
|
, errorHtml
|
||||||
, buttonWrapper [ newButton, useButton ]
|
, buttonWrapper [ newButton, useButton ]
|
||||||
|
@ -116,14 +84,14 @@ viewCache level (cm, cs) =
|
||||||
slotLabels =
|
slotLabels =
|
||||||
List.indexedMap (\i _ -> td [] [ text <| String.fromInt i ])
|
List.indexedMap (\i _ -> td [] [ text <| String.fromInt i ])
|
||||||
<| List.repeat cm.setSize ()
|
<| List.repeat cm.setSize ()
|
||||||
slotLabel = th [ colspan cm.setSize ] [ text "Slot" ]
|
slotLabel = td [ colspan cm.setSize ] [ text "Slot" ]
|
||||||
allSlotLabels = List.concat <| List.repeat cm.setCount slotLabels
|
allSlotLabels = List.concat <| List.repeat cm.setCount slotLabels
|
||||||
allSlotsLabel = List.repeat cm.setCount slotLabel
|
allSlotsLabel = List.repeat cm.setCount slotLabel
|
||||||
|
|
||||||
setLabels =
|
setLabels =
|
||||||
List.indexedMap (\i _ -> td [ colspan cm.setSize ] [ text <| String.fromInt i ])
|
List.indexedMap (\i _ -> td [ colspan cm.setSize ] [ text <| String.fromInt i ])
|
||||||
<| List.repeat cm.setCount ()
|
<| List.repeat cm.setCount ()
|
||||||
setLabel = [ th [ colspan <| cm.setSize * cm.setCount ] [ text "Set" ] ]
|
setLabel = [ td [ colspan <| cm.setSize * cm.setCount ] [ text "Set" ] ]
|
||||||
setRow set =
|
setRow set =
|
||||||
let
|
let
|
||||||
slotHtml s =
|
slotHtml s =
|
||||||
|
@ -134,42 +102,43 @@ viewCache level (cm, cs) =
|
||||||
List.map slotHtml set
|
List.map slotHtml set
|
||||||
cacheRow = List.concat <| List.map setRow cs
|
cacheRow = List.concat <| List.map setRow cs
|
||||||
cacheTable =
|
cacheTable =
|
||||||
table [ class "table" ]
|
table []
|
||||||
[ tr [ hidden (cm.setCount == 1), class "table-info" ] setLabel
|
[ tr [ classList [("hidden", cm.setCount == 1)] ] setLabel
|
||||||
, tr [ hidden (cm.setCount == 1) ] setLabels
|
, tr [ classList [("hidden", cm.setCount == 1)] ] setLabels
|
||||||
, tr [ hidden (cm.setSize == 1), class "table-info" ] allSlotsLabel
|
, tr [ classList [("hidden", cm.setSize == 1)] ] allSlotsLabel
|
||||||
, tr [ hidden (cm.setSize == 1) ] allSlotLabels
|
, tr [ classList [("hidden", cm.setSize == 1)] ] allSlotLabels
|
||||||
, tr [] cacheRow
|
, tr [] cacheRow
|
||||||
]
|
]
|
||||||
|
|
||||||
in
|
in
|
||||||
panel
|
div [ class "cache" ]
|
||||||
[ h3 [] [ text <| "L" ++ String.fromInt (level + 1) ++ " Cache" ]
|
[ h3 [] [ text <| "L" ++ String.fromInt level ++ " Cache" ]
|
||||||
, cacheTable
|
, cacheTable
|
||||||
]
|
]
|
||||||
|
|
||||||
viewCacheHierarchy : CacheHierarchy -> Html Msg
|
viewCacheHierarchy : CacheHierarchy -> Html Msg
|
||||||
viewCacheHierarchy ch =
|
viewCacheHierarchy ch =
|
||||||
let
|
let
|
||||||
levels = div []
|
levels = div [ class "cache-levels" ]
|
||||||
<| List.indexedMap viewCache ch
|
<| List.indexedMap viewCache ch
|
||||||
in
|
in
|
||||||
levels
|
div [ class "cache-hierarchy" ] <|
|
||||||
|
[ h2 [] [ text <| "Cache State" ]
|
||||||
|
, levels
|
||||||
|
]
|
||||||
|
|
||||||
viewAccessView : Model -> AccessView -> Html Msg
|
viewAccessView : Model -> AccessView -> Html Msg
|
||||||
viewAccessView m av =
|
viewAccessView m av =
|
||||||
let
|
let
|
||||||
currentCache = Maybe.withDefault [] m.hierarchy
|
currentCache = Maybe.withDefault [] m.hierarchy
|
||||||
in
|
in
|
||||||
div []
|
div [ class "access-view" ]
|
||||||
[ h2 [] [ text "Access Simulation" ]
|
[ h2 [] [ text "Access Simulation" ]
|
||||||
, buttonWrapper
|
, buttonWrapper
|
||||||
[ primaryButton "Back" AccessViewBack
|
[ button "Forward" AccessViewForward
|
||||||
, primaryButton "Forward" AccessViewForward
|
, button "Back" AccessViewBack
|
||||||
]
|
]
|
||||||
, h3 [] [ text "Access event log" ]
|
|
||||||
, viewAccessLog av
|
, viewAccessLog av
|
||||||
, h3 [] [ text "Current cache state" ]
|
|
||||||
, viewCacheHierarchy <| effectiveCacheHierarchy currentCache av
|
, viewCacheHierarchy <| effectiveCacheHierarchy currentCache av
|
||||||
]
|
]
|
||||||
|
|
||||||
|
@ -177,10 +146,11 @@ viewAccessLog : AccessView -> Html Msg
|
||||||
viewAccessLog (aes, ap) =
|
viewAccessLog (aes, ap) =
|
||||||
let
|
let
|
||||||
resultSpan r =
|
resultSpan r =
|
||||||
span [ classList [ ("badge", True), ("badge-success", r == Hit), ("badge-danger", r == Miss) ] ]
|
case r of
|
||||||
[ text <| if r == Hit then "Hit" else "Miss" ]
|
Hit -> span [ class "success" ] [ text "HIT" ]
|
||||||
|
Miss -> span [ class "failure" ] [ text "MISS" ]
|
||||||
downEvent n ae = div [ class "event" ]
|
downEvent n ae = div [ class "event" ]
|
||||||
[ text <| "L" ++ String.fromInt (n + 1) ++ " "
|
[ text <| "L" ++ String.fromInt (n + 1)
|
||||||
, resultSpan ae.result
|
, resultSpan ae.result
|
||||||
]
|
]
|
||||||
upEvent n ae = div [ class "event" ]
|
upEvent n ae = div [ class "event" ]
|
||||||
|
@ -193,48 +163,35 @@ viewAccessLog (aes, ap) =
|
||||||
Up n -> List.indexedMap downEvent aes ++
|
Up n -> List.indexedMap downEvent aes ++
|
||||||
(List.indexedMap upEvent <| List.drop n aes)
|
(List.indexedMap upEvent <| List.drop n aes)
|
||||||
in
|
in
|
||||||
div [] events
|
div [ class "access-log" ]
|
||||||
|
[ h3 [] [ text "Simulation events" ]
|
||||||
|
, div [ class "access-log-events" ] events
|
||||||
|
]
|
||||||
|
|
||||||
viewAccessInput : Model -> Html Msg
|
viewAccessInput : Model -> Html Msg
|
||||||
viewAccessInput m =
|
viewAccessInput m =
|
||||||
let
|
let
|
||||||
accessButton = maybeButton (String.toInt m.accessInput) "Access address" Access
|
accessButton =
|
||||||
editHierarchyButton = button "Edit hierarchy" (UseHierarchy Nothing)
|
case String.toInt m.accessInput of
|
||||||
|
Just i -> optionalButton True "Access address" (Access i)
|
||||||
|
Nothing -> optionalButton False "Access address" (Access -1)
|
||||||
in
|
in
|
||||||
div []
|
div [ class "access-input" ]
|
||||||
[ h2 [] [ text "Run access simulation" ]
|
[ h2 [] [ text "Run access simulation" ]
|
||||||
|
, div [ class "note" ]
|
||||||
|
[ text "Please make sure to click \"Use Hierarchy\" to load a hierarchy to simulate."
|
||||||
|
]
|
||||||
, labeledInput "Access address" m.accessInput ChangeAccessInput
|
, labeledInput "Access address" m.accessInput ChangeAccessInput
|
||||||
, buttonWrapper [ accessButton, editHierarchyButton ]
|
, accessButton
|
||||||
]
|
]
|
||||||
|
|
||||||
viewDescription : Html Msg
|
viewError : Bool -> String -> Html Msg
|
||||||
viewDescription =
|
viewError hide e = div [ classList [ ("hidden", hide), ("error", True) ] ] [ text e ]
|
||||||
div []
|
|
||||||
[ h1 [] [ text "Cache simulator" ]
|
|
||||||
, p []
|
|
||||||
[ text <| "This is a simulator for testing various cache configurations for educational purposes. It allows for the creation of"
|
|
||||||
++ " n-way associative caches, and their special cases (direct mapped and fully associative caches)."
|
|
||||||
]
|
|
||||||
, p []
|
|
||||||
[ text <| "To use the simulator, first create a fitting cache configuration by using the \"Add level\" button,"
|
|
||||||
++ " as well as the settings provided by each individual cache level. When the cache is correctly specified, and"
|
|
||||||
++ " no warnings appear, click \"Use hierarchy\" to load the specified hierarchy and begin simulating. To simulate,"
|
|
||||||
++ " type a block address into the \"Access address\" field, and click \"Access\". This will bring forward the simulation"
|
|
||||||
++ " view, which will allow you to step through the steps of accessing a cache."
|
|
||||||
]
|
|
||||||
]
|
|
||||||
|
|
||||||
viewBase : Model -> Html Msg
|
viewBase : Model -> Html Msg
|
||||||
viewBase m =
|
viewBase m =
|
||||||
let
|
let
|
||||||
rawView =
|
rawView = viewRawCacheModelHierarchy m.rawHierarchy
|
||||||
case m.hierarchy of
|
|
||||||
Nothing -> [ viewRawCacheModelHierarchy m.rawHierarchy ]
|
|
||||||
Just _ -> []
|
|
||||||
accessInputView =
|
|
||||||
case (m.hierarchy, m.accessView) of
|
|
||||||
(Just _, Nothing) -> [ viewAccessInput m ]
|
|
||||||
_ -> []
|
|
||||||
cacheView =
|
cacheView =
|
||||||
case m.accessView of
|
case m.accessView of
|
||||||
Nothing ->
|
Nothing ->
|
||||||
|
@ -242,6 +199,6 @@ viewBase m =
|
||||||
<| Maybe.map (List.singleton << viewCacheHierarchy) <| m.hierarchy
|
<| Maybe.map (List.singleton << viewCacheHierarchy) <| m.hierarchy
|
||||||
Just _ -> []
|
Just _ -> []
|
||||||
accessView = Maybe.withDefault [] <| Maybe.map (List.singleton << viewAccessView m) <| m.accessView
|
accessView = Maybe.withDefault [] <| Maybe.map (List.singleton << viewAccessView m) <| m.accessView
|
||||||
|
accessInputView = [ viewAccessInput m ]
|
||||||
in
|
in
|
||||||
div [ class "container" ]
|
div [] <| [ rawView ] ++ cacheView ++ accessView ++ accessInputView
|
||||||
<| [ viewDescription] ++ rawView ++ accessInputView ++ accessView ++ cacheView
|
|
||||||
|
|
|
@ -8,11 +8,15 @@ import CacheSim.View exposing (..)
|
||||||
import Browser exposing (Document, document)
|
import Browser exposing (Document, document)
|
||||||
import Html exposing (text)
|
import Html exposing (text)
|
||||||
|
|
||||||
|
testCacheModelHierarchy =
|
||||||
|
[ { blockSize = "128", setCount = "8", setSize = "1" }
|
||||||
|
]
|
||||||
|
|
||||||
init : Flags -> (Model, Cmd Msg)
|
init : Flags -> (Model, Cmd Msg)
|
||||||
init f =
|
init f =
|
||||||
let
|
let
|
||||||
initialModel =
|
initialModel =
|
||||||
{ rawHierarchy = []
|
{ rawHierarchy = testCacheModelHierarchy
|
||||||
, hierarchy = Nothing
|
, hierarchy = Nothing
|
||||||
, accessView = Nothing
|
, accessView = Nothing
|
||||||
, accessInput = ""
|
, accessInput = ""
|
||||||
|
|
|
@ -1,3 +1,128 @@
|
||||||
.btn-group {
|
@import url('https://fonts.googleapis.com/css?family=Raleway&display=swap');
|
||||||
width: min-content;
|
$primary-color: lighten(#26c176, 30%);
|
||||||
|
|
||||||
|
body {
|
||||||
|
font-family: Raleway, serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, h2, h3, h4, h5, h6 {
|
||||||
|
margin-bottom: 5px;
|
||||||
|
margin-top: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hidden {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input-group {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
|
||||||
|
span {
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
input {
|
||||||
|
flex-grow: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type="text"] {
|
||||||
|
padding: 5px;
|
||||||
|
border-radius: 5px;
|
||||||
|
border: none;
|
||||||
|
background-color: #efefef;
|
||||||
|
|
||||||
|
&:active, &:focus {
|
||||||
|
background-color: $primary-color;
|
||||||
|
transition: .25s;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.error {
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 5px;
|
||||||
|
border-radius: 5px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
border: 2px solid tomato;
|
||||||
|
color: tomato;
|
||||||
|
}
|
||||||
|
|
||||||
|
.note {
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 5px;
|
||||||
|
border-radius: 5px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
span.success {
|
||||||
|
margin-left: 10px;
|
||||||
|
color: green;
|
||||||
|
}
|
||||||
|
|
||||||
|
span.failure {
|
||||||
|
margin-left: 10px;
|
||||||
|
color: tomato;
|
||||||
|
}
|
||||||
|
|
||||||
|
button, input[type="button"] {
|
||||||
|
box-sizing: border-box;
|
||||||
|
border: none;
|
||||||
|
margin-right: 5px;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
display: inline-block;
|
||||||
|
padding: 5px;
|
||||||
|
border-radius: 5px;
|
||||||
|
font-size: 14px;
|
||||||
|
|
||||||
|
&:hover, &:focus {
|
||||||
|
background-color: $primary-color;
|
||||||
|
transition: .25s;
|
||||||
|
|
||||||
|
&:disabled {
|
||||||
|
background-color: lightgrey;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.cache-model-levels {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cache-model {
|
||||||
|
max-width: 600px;
|
||||||
|
padding: 10px;
|
||||||
|
border-radius: 5px;
|
||||||
|
border: 2px solid lightgrey;
|
||||||
|
margin: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cache, .cache-model {
|
||||||
|
padding: 10px;
|
||||||
|
border-radius: 5px;
|
||||||
|
border: 2px solid lightgrey;
|
||||||
|
margin: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cache-model-hierarchy, .cache-hierarchy, .access-input {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
table {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
tr {
|
||||||
|
&:nth-child(1), &:nth-child(3) {
|
||||||
|
background-color: $primary-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
td {
|
||||||
|
text-align: center;
|
||||||
|
padding: 3px;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user